<template>
	<div class="box">
		<!-- left start -->
		<session-record @getSessionCon="getSessionCon" @initList="getSessionlist" @getMoreList="getMoreList">
		</session-record>
		<!-- left end -->
		<!-- {{base}} -->
		<div :class="[{ none: base.isNewSess }, 'sessionBox']" ref="chatContent">
			<div v-if="base.guideIndex == 6">
				<div class="talktem"></div>
				<div class="temBtn">
					<span class="tie"></span>
				</div>
			</div>
			<div v-if="base.guideIndex == 7">
				<div class="waptalktem"></div>
			</div>
			<!-- new session start -->
			<ai-calculator v-if="base.sessionType == 2"></ai-calculator>
			<new-session v-if="base.isNewSess && base.sessionType == 0" @createTitle="createTitle"></new-session>
			<!-- new session end -->
			<div class="quesCon clearfix" ref="chatBox" v-if="!base.isNewSess">
				<p class="loadgin" v-if="base.talkLoad">正在加载...</p>
				<div v-if="isNoSession && !base.isEnterLoad">
					<div class="quesBox clearfix">
						<div class="userPic system">
							<img :src="`${imgurl}systempic.png`" />
						</div>
						<div class="answer">
							<div class="answerBox errorAnswer">
								<div class="errorText">
									很抱歉，系统出错了！请重新创建对话。
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="mianBox" v-for="(list, k) in talkList" :key="k">
					<div :class="[
				{ user: item.identity == 'user' && !base.isMobile },
				{ wapuser: base.isMobile },
				'quesBox clearfix',
			  ]" v-for="(item, index) in list" :key="index">
						<!-- pdf 文件 -->
						<template v-if="item.isType == 2 || item.isType == 3">
							<div :class="[
					{ user: !base.isMobile },
					{ system: base.isMobile },
					'userPic',
				  ]" v-if="item.identity == 'user'">
								<img v-if="useStore?.avatar" :src="`${baseurl}${useStore?.avatar}`" />
								<img v-else :src="`${imgurl}pic.jpg`" />
							</div>
							<div :class="[{ active: item.isRun }, 'userPic system']" v-else>
								<img v-if="item.isRun && base.isMobile" class="run" :src="`${imgurl}systempic.gif`" />
								<video class="videoLoad" v-if="item.isRun && !base.isMobile" muted autoplay="autoplay"
									loop="loop" :src="`${imgurl}systempic.mp4`"></video>
								<img v-if="!item.isRun" :src="`${imgurl}systempic.png`" />
							</div>
							<template v-if="item.identity == 'user'">
								<div :class="[
					  { selected: isSelected },
					  `quertitle ${ispdfRE(item.content)}`,
					]" @dblclick="copyContent(item.content)" v-html="item.content"></div>
							</template>
							<div v-else class="znxjWidht">
								<!-- 智能询价 问题 -->
								<div :class="[
					  { active: item.count > 1 && !item.isRun },
					  { multiple: item.count > 3 && !item.isRun },
					  'answer',
					]">
									<div class="answerBox">
										<div :class="[
						  { active: item.isRun },
						  { runing: isChat && item.isRun },
						  {
							long: item?.sessionArr && item?.sessionArr.length > 1,
						  },
						  'chatAnswer markdown-body',
						]">
											<!-- 智能询价 -->
											<div class="zhinxj" v-if="item.isType == 2">
												<!-- 文档解析步骤 -->
												<div class="wenda">使用:智能询价</div>
											</div>
											<!-- 智能询价报价 -->
											<template v-if="
							item.isType == 2 &&
							item.companylist &&
							item?.companylist.length > 0 &&
							item.issend != 3
						  ">
												<div class="znbj">
													<div class="comitemC" v-for="(ite, ind) in item.companylist"
														:key="ite.id" @click="selectMulter(ite, item)">
														<div class="xz" :class="[
								  { act: isBaoHan(ite.id, item.companyids) },
								]">
															<div class="xzh"></div>
														</div>
														<div class="comicName" @click.stop="
								  item.isRun ? '' : sendCompany(ite, item, $event)
								">
															<span class="comicNameS" :class="[
									{ Act: isBaoHan(ite.id, item.companyids) },
								  ]">
																{{ ite.title }}
															</span>
														</div>
														<div class="dialog1" :style="{
								  left: dialogS.style.left + 'px',
								  top: dialogS.style.top + 'px',
								}" v-if="
								  dialogS.visble && dialogS.item.id == item.id
								">
															<span class="title1 show1">你好，<br />
																是否需要新建对话了解该公司介绍？</span>
															<div class="btnpage1">
																<span class="cancel1 flexC1"
																	@click.stop="dialCancel">取消</span>
																<span class="define1 flexC1"
																	@click.stop="dialSubmit">确定</span>
															</div>
														</div>
													</div>
												</div>
												<!-- 智能询价备注 -->
												<div class="znxjTex" v-if="item.companyids.length > 0">
													<el-input class="znxjTexInput" v-model="item.remark" :rows="4"
														type="textarea" placeholder="请输入报价备注" resize="none"
														maxlength="200" :show-word-limit="true" />
												</div>
											</template>
											<!-- 智能询价发送报告 -->
											<template v-if="
							item.isType == 3 &&
							item.companylist &&
							item?.companylist.length > 0
						  ">
												<div>
													<span :class="[{ active: item.isShowLink }, 'btnlink']"
														@click="openLink(k, item.id)" v-if="!item.isBeCreate">
														已向{{
								item?.companylist.length
							  }}企业推送详细报价索取申请：
													</span>
													<span class="btnlink" v-else>
														{{ createCon }}
														<p v-html="createItem"></p>
													</span>
													<div class="linkbox" v-if="item.isShowLink">
														<span class="show" @click.stop="
								  item.isRun
									? ''
									: sendCompany(link, item, $event)
								" v-for="(link, k) in item.companylist" :key="k">推送第{{ k + 1 }}家相关企业：
															<a target="_blank">{{ link.title }}</a>
														</span>
														<div class="dialog1" :style="{
								  left: dialogS.style.left + 'px',
								  top: dialogS.style.top + 'px',
								}" v-if="
								  dialogS.visble && dialogS.item.id == item.id
								">
															<span class="title1 show1">你好，<br />
																是否需要新建对话了解该公司介绍？</span>
															<div class="btnpage1">
																<span class="cancel1 flexC1"
																	@click.stop="dialCancel">取消</span>
																<span class="define1 flexC1"
																	@click.stop="dialSubmit">确定</span>
															</div>
														</div>
													</div>
												</div>
												<div class="znxjCon" v-if="item.remark">
													<div class="znxjCo">备注信息:{{ item.remark }}</div>
												</div>
											</template>
											<div class="chatView" style="colo: #666" v-html="getMarked(item?.content)">
											</div>

											<div v-if="
							item.isType == 2 &&
							!item.isRun &&
							item.companylist.length > 0
						  ">
												<el-button type="primary" v-if="item.issend == 3" disabled>
													已发送报价
												</el-button>
												<el-button type="primary" v-else :disabled="item.companyids.length <= 0"
													@click="sendSumbitDetail(item, k)">
													确认并发送详细报价
												</el-button>
											</div>
										</div>
										<img v-if="!item.isRun" :src="`${imgurl}subscript.png?v=001`"
											class="subscript" />
									</div>
								</div>
							</div>
						</template>
						<template v-else>
							<div :class="[
					{ user: !base.isMobile },
					{ system: base.isMobile },
					'userPic',
				  ]" v-if="item.identity == 'user'">
								<img v-if="useStore?.avatar" :src="`${baseurl}${useStore?.avatar}`" />
								<img v-else :src="`${imgurl}pic.jpg`" />
							</div>
							<div :class="[{ active: item.isRun }, 'userPic system']" v-else>
								<img v-if="item.isRun && base.isMobile" class="run" :src="`${imgurl}systempic.gif`" />
								<video class="videoLoad" v-if="item.isRun && !base.isMobile" muted autoplay="autoplay"
									loop="loop" :src="`${imgurl}systempic.mp4`"></video>
								<img v-if="!item.isRun" :src="`${imgurl}systempic.png`" />
							</div>

							<div :class="[{ selected: isSelected }, 'quertitle']" @dblclick="copyContent(item.content)"
								v-if="item.identity == 'user'" v-html="item.content"></div>
							<div v-else>
								<div :class="[
					  { active: item.count > 1 && !item.isRun },
					  { multiple: item.count > 3 && !item.isRun },
					  'answer',
					]">
									<div class="answerBox">
										<div :class="[
						  { active: item.isRun },
						  { runing: isChat && item.isRun },
						  {
							long:
							  item?.sessionArr &&
							  item?.sessionArr.length > 1 &&
							  !item.isRun,
						  },
						  'chatAnswer markdown-body',
						]">
											<div v-if="item.relatelink && item?.relatelink.length > 0">
												<span :class="[{ active: item.isShowLink }, 'btnlink']"
													@click="openLink(k, item.id)" v-if="!item.isBeCreate">
													找到了{{ item?.relatelink.length }}篇资料作为参考：
												</span>
												<span class="btnlink" v-else>
													{{ createCon }}
													<p v-html="createItem"></p>
												</span>
												<div class="linkbox" v-if="item.isShowLink">
													<span class="show" v-for="(link, k) in item.relatelink"
														:key="k">找到第{{ k + 1 }}篇案例资料：<a :href="link.url"
															target="_blank">{{ link.title }}</a></span>
												</div>
											</div>
											<!-- 海南政策 -->
											<!-- 11111{{  item.isType }} -->
											<div v-if="item.isType == 8">
												<!-- 111111 -->
												<span :class="[{ active: item.isShowRule }, 'btnlink']"
													@click="openRule(k)" v-if="!item.isBeCreate">
													使用：海南政策
												</span>
												<span class="btnlink" v-else>
													{{ createCon }}
													<p v-html="createItem"></p>
												</span>
												<div class="linkbox" v-if="item.isShowRule">
													<span class="show" v-for="(link, k) in ruleListHai()"
														:key="k">{{ link.title }}<i>{{ link.description }}</i></span>
												</div>
											</div>
											<!-- -->
											<div class="videoBox" v-if="
							((item.sessionArr && item?.sessionArr.length > 0) ||
							  item?.task_id) &&
							!item.isRun &&
							!base.isRegin &&
							item?.content != '已停止生成'
						  ">
												<div class="voiceCeate" v-if="!item?.isRun && !item?.nowtaskId"
													@click="playAutio(item.content, item.nowId, k)"></div>
												<div class="videoBtn" v-if="item?.nowtaskId && !item?.isRun">
													<div class="audioBtn" v-if="item?.voice"
														@click="voicestatus(k, item.nowtaskId)">
														<div :class="[
								  { pause: item?.audioplay },
								  { disable: item?.isLoadPlay },
								  'btnplay',
								]"></div>
														<div class="wave" v-if="!item?.audioplay"></div>
														<sonic-wave color="#999" v-else> </sonic-wave>
													</div>
													<div class="iswave" v-else>音频生成中~~</div>
												</div>
											</div>

											<div class="chatView" style="colo: #666" v-html="getMarked(item?.content)">
											</div>
											<!-- {{ item?.isType }}
											  filepath:{{ item }}
											  run:{{ item.isRun }} -->
											<span class="source" v-if="
							!item.isRun &&
							item?.filepath &&
							item?.filepath.length > 0
						  ">相关文件：</span>

											<span class="source" v-if="item?.source && !item.isRun"
												@click="putQues(item.source)">回答来源于：{{ item.source }}</span>
											<div class="filepath" v-if="
							item?.isType == 8 && item?.filepath && !item.isRun
						  ">
												<a :href="file.url" target="_blank" class="fileItem"
													v-for="file in item?.filepath">
													<img
														:src="`${imgurl}${getWordname(file.url)}.png?v=001`" />{{ file.name }}
												</a>
											</div>
											<!-- v-if="(item.sessionArr && item?.sessionArr.length > 1 || item?.task_id) && !item.isRun" -->
										</div>

										<img v-if="!item.isRun" :src="`${imgurl}subscript.png?v=001`"
											class="subscript" />
									</div>

									<div :class="base.isMobile ? 'btnpage mobile' : 'btnpage pc'" v-if="
						item.sessionArr &&
						item?.sessionArr.length > 1 &&
						!item.isRun
					  ">
										<div class="button-prev" @click.stop="changeSession(0, k, item.id)">
											<img v-if="base.isMobile" :src="`${imgurl}left01.png`" alt="" />
											<img v-else :src="`${imgurl}left.png`" alt="" />
										</div>
										<span class="count">{{ item.key }}/{{ item.count }}</span>
										<div class="button-next" @click.stop="changeSession(1, k, item.id)">
											<img v-if="base.isMobile" :src="`${imgurl}left01.png`" alt="" />
											<img v-else :src="`${imgurl}left.png`" alt="" />
										</div>
									</div>

									<div :class="[{ active: !item?.isRun }, 'eidtBox']">
										<div v-if="!item.source">
											<span :class="[{ disable: isTwo == true }, 'generate']"
												v-if="item?.isRun && isBeStop == false"
												@click="isTwo == false ? stopCreate() : ''">
												停止生成
											</span>
											<span class="generate beging" v-if="item?.isRun && isBeStop == true">
												正在停止生成
											</span>
											<span class="generate" v-if="
							k == talkList.length - 1 &&
							!item?.isRun &&
							item.isType != 9
						  " @click="getchatRebuild(k, item.id)">
												重新生成
											</span>
										</div>
										<div class="btndelete" v-if="!item?.isRun" @click="deleteRecord(k)">
											<span class="bedelete">删除对话</span>
											<div class="dialog diadelete" v-if="item.deleteRecord">
												<span class="title show">确定要删除当前对话吗？</span>
												<div class="btnList">
													<span class="cancel flexC" @click.stop="cancelRecord()">取消</span>
													<span class="define flexC" @click.stop="definelRecord(k)">确定</span>
												</div>
											</div>
										</div>

										<span :class="[{ active: item?.isCopy }, 'copy']" v-if="!item?.isRun"
											@click="copyText(k, item.id)">
											{{ isCopy ? "复制成功" : "复制文本" }}
										</span>
										<div v-if="!item?.isRun" :class="[
						  {
							active: base.isShowFeedques && isReplayId == item.id,
						  },
						  { isEnd: k == talkList.length - 1 },
						  'like',
						]" @click="getContFeed($event, k, item.id)">
											<video class="videoCon" v-if="k == talkList.length - 1 && !base.isMobile"
												muted autoplay="autoplay" loop="loop" :src="`${imgurl}yes.mp4`"></video>
											<div class="dianzan flexC">
												<img v-if="k == talkList.length - 1 && base.isMobile"
													:src="`${imgurl}dianzan.gif`" />
											</div>
											<i>内容反馈</i>
										</div>
									</div>
								</div>
								<!-- 推荐问题 -->
								<div class="newQues clearfix" v-if="
					  item?.relatedList &&
					  item?.relatedList.length > 0 &&
					  !item.isRun
					">
									<span class="name show">您还可以继续问我：</span>
									<div class="newList">
										<span class="newItem" @click="putQues(qa)" v-for="(qa, i) in item.relatedList"
											:key="i">
											{{ qa }}
										</span>
									</div>
								</div>
								<!-- 搜索问题 -->
								<div class="none newQues clearfix" v-if="
					  item?.searchList &&
					  item?.searchList.length > 0 &&
					  !item.isRun
					">
									<span class="name show company">企业专业回答：</span>
									<div class="searchList">
										<span class="searchItem" @click="searchAnswerBy(qa)"
											v-for="(qa, i) in item.searchList" :key="i">
											<a class="comp">{{ qa.brand }}</a>{{ qa.title }}
										</span>
									</div>
								</div>
							</div>
						</template>
					</div>
				</div>
			</div>
			<div class="askCon guide" v-if="base.guideIndex == 1">
				<div class="textBox" id="textBox">
					<span class="tie" v-if="base.guideIndex == 1"></span>
					<div class="textCon">请输入问题，可通过shift+回车换行</div>
					<span class="btnEnter show"></span>
				</div>
				<span class="mark" v-if="!base.isMobile">
					内容由AI生成,仅供参考,请遵守《WIRE AI协议》、《WIRE
					AI个人信息保护规则》版本:V1.1.1
				</span>
			</div>
			<div :class="[{ active: base.isShowLeft }, 'askCon']" v-if="base.guideIndex != 1">
				<div class="bg" v-if="base.isWord"></div>
				<div :class="[{ active: isTextInput }, 'textBox']" id="textBox">
					<div class="commdesc" v-if="base.isCommand">
						<div class="comandw" ref="comandw">
							<img :src="`${baseurl}${base.curCommand.iconpath}`" alt=""
								v-if="base.curCommand.iconpath" />
							<img :src="`${imgurl}list_icon_01.png`" alt="" v-else />
							<span>{{ base.curCommand.title }}:</span>
						</div>

						<textarea class="commandInput" :style="base.curCommand.command.length > 40 ? 'height:45px' : ''"
							type="textarea" v-model="base.curCommand.command"></textarea>
					</div>

					<span class="tie" v-if="base.guideIndex == 1"></span>

					<span v-if="base.isHaiRule" class="hnrule"></span>
					<div class="commtentx" v-if="base.isCommand">
						<div class="commtentxtitle">
							<img :src="`${imgurl}desc.png`" alt="" />输入主题:
						</div>

						<div data-display-placeholder="true" :class="[
				  { active: isPolish },
				  { check: isFocus },
				  'textCon comCon',
				]" contenteditable="true" @focus="textFocus()" @blur="blurFocus()" @paste="handlePaste" @input="adjustTextHeight"
							@keydown="handleKeyDown" ref="textarea">
							{{ commendCon }}
						</div>
					</div>
					<div v-else>
						<div v-if="!base.isWord" placeholder="请输入问题，可通过shift+回车换行" data-display-placeholder="true"
							:class="[{ active: isPolish }, { check: isFocus }, 'textCon']" contenteditable="true"
							@focus="textFocus()" @blur="blurFocus()" @paste="handlePaste" @input="adjustTextHeight"
							@keydown="handleKeyDown" ref="textarea">
							{{ questionCon }}
						</div>
					</div>

					<div :style="{
				left: `${polisStyle.left}px`,
				top: `${polisStyle.top}px`,
			  }" v-if="isPolish && !base.isHaiRule && !base.isWord" @click="getExtendque"
						:class="[{ load: polishLoading }, 'banpolish']" id="polish" ref="polish">
						<span class="bants"><i>润色指令内容</i></span>
					</div>

					<!-- <div v-if="!base.isWord" class="textCon" contenteditable="true">
					  </div> -->
					<div v-if="base.isWord" class="textCon">
						请输入问题，可通过shift+回车换行
					</div>
					<plugins :classData="menuClassList" @onSuccessPlugins="onSuccessPlugins"
						@onSendCalculator="onSendCalculator"></plugins>
					<span :class="[{ run: base.isEnterLoad }, 'btnEnter show']" @click="enterSession"></span>
				</div>
				<span class="mark" v-if="!base.isMobile">
					内容由AI生成,仅供参考,请遵守《WIRE AI协议》、《WIRE
					AI个人信息保护规则》版本:V1.1.1
				</span>
				<popcon v-if="isShowSession" @cancelDelate="closeDialog" @definelDelate="showDialog">
				</popcon>
			</div>
		</div>
		<!-- 问题反馈 -->
		<feed-ques v-if="base.isShowFeedques"></feed-ques>
		<!-- 功能反馈 -->
		<feed-back v-if="base.isShowfeed"></feed-back>
		<!-- 新手引导 -->
		<guide v-if="base.isShowGuide && !base.isMobile" @getSessionCon="getSessionCon">
		</guide>
		<!-- 移动端-新手引导 -->
		<guide-wap v-if="base.isShowGuide && base.isMobile" @getSessionCon="getSessionCon">
		</guide-wap>
		<!-- <audio ref="audioElement" @ended="onAudioEnded" :src="audioSrc">
		  </audio> -->
		<!-- 消息中心-个人消息1 -->
		<message-personal v-if="base.isMessageType == 1"></message-personal>
		<!-- 消息中心-企业消息 -->
		<message-enterprise v-if="base.isMessageType == 2"></message-enterprise>

		<transition>
			<div class="aimain" v-if="base.aiboxShow">

				<aibox></aibox>
			</div>
		</transition>
	</div>
</template>
<script setup lang='ts'>
	import {
		useSystemStore
	} from "@/store/modules/system";
	import {
		useUserStore
	} from "@/store/modules/user";
	import popcon from "../common/dialog.vue";
	import aibox from "../plugins/aiBox.vue";

	import sonicWave from "../common/sonicWave.vue";
	import feedBack from "./feedBack.vue";
	import feedQues from "./feedQues.vue";
	import guide from "../guide/guide.vue";
	import guideWap from "../guide/guideWap.vue";
	import newSession from "./sessionNew.vue";
	import sessionRecord from "./sessionRecord.vue";
	import plugins from "./plugins.vue";
	import messagePersonal from "../messageCenter/messagePersonal.vue";
	import messageEnterprise from "../messageCenter/messageEnterprise.vue";
	import aiCalculator from "../plugins/aiCalculator.vue";
	import {
		marked
	} from "marked";
	import hljs from "highlight.js"; // 代码块高亮
	import "highlight.js/styles/github.css"; // 代码块高亮样式
	import "github-markdown-css"; // 整体 markdown 样式
	import MarkdownIt from "markdown-it";
	import markdownItHighlightjs from "markdown-it-highlightjs";
	import markdownItCodeCopy from "markdown-it-code-copy";
	import clipboard3 from "vue-clipboard3"; //复制文本
	import {
		decodeKey,
		excludeKey,
		defaultReply,
		questionList,
		ruleListHai,
		getWordname,
	} from "../../utils/base.ts";
	import {
		ispdfRE
	} from "../../utils/timeFun.ts";

	import {
		throttle
	} from "throttle-debounce";

	import pdfapi from "@/api/pdf.ts";
	import pythonapi from "@/api/python.ts";
	const {
		toClipboard
	} = clipboard3();
	let placeholder = ref("点击输入标题");
	const base = useSystemStore();
	const useStore = useUserStore();
	const api = inject("$base", null as any);
	const $_ = inject("$_", null as any);
	const imgurl = import.meta.env.VITE_APP_TITLE + "/assets/images/";
	const baseurl = inject("$baseurl", null as any);
	const talkList = ref < any > ([]);
	const isTextInput = ref < boolean > (false);
	const commendCon = ref < string > ("请对指令进行具体的主题描述");
	const questionCon = ref < string > ("请输入问题，可通过shift+回车换行");
	const currentIndex = ref < number > (1);
	const isShowPlug = ref < boolean > (true);
	const isSessionCon = ref < boolean > (false);
	const isPlug = ref < boolean > (false);
	const isCurrent = ref < boolean > (false);
	const isNoSecurity = ref < boolean > (false);
	const isCopy = ref < boolean > (false);
	const isReplayId = ref < number > ();
	const isRecom = ref < boolean > (false);
	const isBurst = ref < boolean > (false);
	const reginKey = ref < number > (false);
	const beTalk = ref < boolean > (false);
	const recomQuesList = ref < any > ([]); //推荐问题
	const searchQuesList = ref < any > ([]); //搜索问题
	const chatContent = ref(null);
	const chatBox = ref(null);
	const isScrolling = ref < boolean > (false);
	const lastScrollHeight = ref < number > (0);
	const isStop = ref < boolean > (false); //停止生成
	const isBeStop = ref < boolean > (false); //正在停止生成
	const chattoken = ref < any > ();
	const isShowLink = ref < boolean > (false);
	const createCon = ref < any > ();
	const createItem = ref < any > ();
	const isSelected = ref(false); //双击选中状态
	const history = ref < any > (); //历史记录
	const isTwo = ref < boolean > (false); //历史记录
	const processTimeout = ref < any > ();
	const currentId = ref < number > ();
	const audiosrc = ref < string > ();
	const audioElement = ref < HTMLAudioElement | null > (null);
	const wsUrl = "wss://www.wireai.com/wss";
	const isEnding = ref < boolean > (false);
	const isStoping = ref < boolean > (false);
	const connectNum = ref < number > (0);
	const fetchList = ref < any > ([]);
	const isQA = ref < boolean > (false); //是否是QA固定答复
	const qAanswer = ref < boolean > (false); //QA答案
	const isQAquestion = ref < boolean > (false); //是否是QA企业信息
	const isShowSession = ref < boolean > (false); //是否创建新会话
	const audioSrc = ref < string > ();
	const newContent = ref < string > ("");
	const comandw = ref(null);

	watch(
		() => base.isNewSess,
		(newValue, oldValue) => {
			if (oldValue != newValue && newValue != 0) {
				if (audioRef.value) {
					audioRef.value.pause();
				}
				talkList.value.forEach((item) => {
					let list = item;
					list.forEach((item2) => {
						item2.audioplay = false;
						item2.isRun = false;
					});
				});
				isPlayAudio.value = false;
			}
			if (newValue == true) {
				talkList.value = [];
			}
			console.log(`count 的值从 ${oldValue} 变为 ${newValue}`);
		}
	);
	/**
	 * 展开推荐链接
	 */
	function openLink(index: number) {
		talkList.value[index].forEach((item) => {
			if (item.identity == "assistant") {
				item.isShowLink = !item.isShowLink;
			}
		});
	}
	/**
	 * 多条答复 左右切换
	 */
	function changeSession(type: number, k: number, id: number) {
		let list = talkList.value[k];
		list.forEach((item) => {
			if (item.id == id) {
				if (type == 0) {
					item.key--;
					if (item.key == 0) {
						item.key = item.count;
					}
				} else {
					if (item.key == item.count) {
						item.key = 1;
					} else {
						item.key++;
					}
				}
				item.content = item.sessionArr[item.key - 1].content;
				item.nowId = item.sessionArr[item.key - 1].id;
				item.nowtaskId = item.sessionArr[item.key - 1].task_id;
				item.voice = item.sessionArr[item.key - 1].voice;
			}
		});
		closeAllvoice();
		console.log(talkList.value);
	}
	/**
	 * mark down 处理样式
	 */
	function getMarked(content) {
		const md = new MarkdownIt({
			html: true,
		});
		md.use(markdownItHighlightjs);
		md.use(markdownItCodeCopy);
		const html = md.render(content);
		return html;
	}
	/**
	 * 编辑会话标题
	 */
	function createTitle(val) {
		questionCon.value = val;
		base.isEnterLoad = true;
		enterSession();
	}
	/**
	 * 双击复制 问题
	 */
	function copyContent(content: string) {
		const textarea = document.createElement("textarea");
		textarea.value = content;
		document.body.appendChild(textarea);
		textarea.select();
		document.execCommand("copy");
		document.body.removeChild(textarea);
		isSelected.value = true;
		setTimeout(() => {
			isSelected.value = false;
		}, 1000);
		ElMessage({
			message: "内容已复制到剪贴板！",
			type: "success",
		});
	}
	/**
	 * 复制文本
	 */
	async function copyText(k: number, id: number) {
		let content;
		talkList.value.forEach((item, index) => {
			if (index == k) {
				item[1].isCopy = true;
				content = item[1].content;
			}
		});
		const parser = new DOMParser();
		const doc = parser.parseFromString(content, "text/html");
		const plainTextContent = doc.body.textContent || "";
		try {
			await toClipboard(plainTextContent);
			ElMessage({
				message: "文本复制成功",
				type: "success",
			});
			setTimeout(() => {
				talkList.value.forEach((item, index) => {
					item[1].isCopy = false;
				});
			}, 1500);
		} catch (error) {
			ElMessage({
				message: "复制失败",
				type: "error",
			});
		}
	}

	/**
	 * 内容反馈
	 */
	function getContFeed(event: event, index: number, id: number) {
		event.stopPropagation();
		base.isShowfeed = false;
		base.isShowFeedques = !base.isShowFeedques;
		isReplayId.value = id;
		talkList.value.forEach((item, k) => {
			if (k == index) {
				base.feedQueItem = {
					ques: item[0],
					answer: item[1],
				};
			}
		});
	}
	/**
	 * 删除会话
	 */
	function deleteRecord(k: number) {
		cancelRecord();
		talkList.value[k][1].deleteRecord = true;
	}
	/**
	 * 关闭 删除会话弹窗
	 */
	function cancelRecord() {
		talkList.value.forEach((GropItem) => {
			GropItem.forEach((item) => {
				item.deleteRecord = false;
			});
		});
	}
	/**
	 * 删除会话 -- 提交
	 * @parm ids 数组
	 */
	function definelRecord(k) {
		let idArr = [];
		talkList.value[k].forEach((item) => {
			idArr.push(item.id);
		});
		let data = {
			ids: idArr.join(","),
			userid: useStore.userIds,
		};
		api.deletehistoryrecord(data).then((res) => {
			talkList.value.splice(k, 1);
		});
	}
	/**
	 * 推荐问题入口提问
	 */
	function putQues(content: string) {
		questionCon.value = content;
		setTimeout(() => {
			if (chatBox.value) {
				chatBox.value.scrollTo({
					top: chatBox.value.scrollHeight,
					behavior: "smooth",
				});
			}
		}, 100);
		enterSession();
	}
	/**
	 * 输入问题入口
	 */
	function enterSession() {
		if (base.isCommand) {
			if (commendCon.value.length + base.curCommand.command.length > 600) {
				ElMessage.error("指令过长，请重新输入");
				return;
			}
			if (commendCon.value && commendCon.value != "请对指令进行具体的主题描述") {
				createSession();

				return;
			}
		}
		if (pastedText.value) {
			questionCon.value = pastedText.value;
		}
		if (
			questionCon.value &&
			questionCon.value != "请输入问题，可通过shift+回车换行"
		) {
			let isShowPop = false;
			talkList.value.forEach((gropItem) => {
				gropItem.forEach((item) => {
					if (item.isType != 1 && item.isType != 8 && item.isType != 0 && item.isType != 9) {
						isShowPop = true;
					}
				});
			});

			if (base.sessionType == 2 || isShowPop == true) {
				isShowSession.value = true;
				return;
			}
			base.isRegin = false;
			createSession();
		}
	}
	/**
	 * 关闭新对话提示
	 */
	function closeDialog() {
		isShowSession.value = false;
	}
	/**
	 * 开启计算器是 创建新对话
	 */
	function showDialog() {
		isShowSession.value = false;
		base.sessionType = 0;
		base.isRegin = false;
		talkList.value = [];
		base.inSessionId = 0;
		createSession();
	}
	/**
	 * 停止生成
	 */
	function stopCreate() {
		if (isStop.value == true && isBeStop.value == true) {
			return;
		}
		isBeStop.value = true;
		isStop.value = true;
		isChat.value = false;
		clearInterval(intervalSoket.value);
	}
	/**
	 * 新建会话 第一步 获取token
	 * @parm sessionid  新窗口进入时为0
	 * @parm content 内容
	 */
	function createSession() {
		fetchList.value = [];
		isEnding.value = false;
		fetchList.value = [];
		isEnding.value = false;
		isStoping.value = false;
		isBeDoing.value = false;
		isTypingStarted.value = false;
		isConnect.value = false;
		isSend.value = false;
		isTwo.value = true;
		isQA.value = false;
		base.isWord = true;
		isStop.value = false;
		base.isNewSess = false;
		newContent.value = "";
		// audioElement.value.pause();
		isPlayAudio.value = false;
		let id = base.inSessionId ? base.inSessionId : 0;
		let content = base.isRegin ?
			talkList.value[reginKey.value][0].content :
			questionCon.value;
		let len;
		currentId.value = id;
		if (base.isRegin == true) {
			len = reginKey.value;
		} else {
			len = talkList.value.length > 0 ? talkList.value.length - 1 : 0;
		}
		if (!content) {
			return;
		}
		talkList.value.forEach((GropItem) => {
			GropItem = GropItem || [];
			GropItem.forEach((item) => {
				item.audioplay = false;
				// item.isRun = false;
				if (item.identity == "assistant") {
					item.relatedList = [];
					item.searchList = [];
				}
			});
		});

		if (base.isCommand) {
			content =
				"AI指令:" +
				base.curCommand.command +
				"<br />输入主题： " +
				commendCon.value;
			newContent.value = content;
		}
		if (base.isNewSess == false && base.isRegin == false) {
			temporary(base.inSessionId);
		}
		let data = {
			userid: useStore.userIds,
			sessionid: id,
			content: content,
		};
		api.chatone(data).then((res) => {
			setTimeout(() => {
				base.isCommand = false;
				base.curCommand = "";
				commendCon.value = "";
				questionCon.value = "";
			}, 1200);
			isPolish.value = false;
			if (
				base.inSessionId == 0 ||
				(base.isRegin == false && base.isNewSess == true)
			) {
				isCurrent.value = true;
				getSessionlist();
			}
			base.inSessionId = res.data.sessionid;
			currentId.value = res.data.sessionid;
			let isHistory = true;
			talkList.value.forEach((GropItem) => {
				GropItem.forEach((item) => {
					if (item.isType == 8) {
						isHistory = false;
					}
				});
			});
			if (isHistory) {
				history.value = res.data.history;
				history.value.forEach((item) => {
					if (item.role == "assistant" && item.isType != 8) {
						item.content = decodeKey(item.content);
					}
				});
			}

			chattoken.value = res.data.token;
			if (newContent.value) {
				fetchData();
			} else {
				if (base.isHaiRule) {
					getsearchRule(content);
				} else {
					if (isQAquestion.value) {
						typewriter(qAanswer.value.title, qAanswer.value.content);
						twoAfter();
					} else {
						getSearchAnswer(1, content);
					}
				}
			}
		});
	}
	/**
	 * 查询海南政策规则
	 * @parm sk 问题
	 */
	function getsearchRule(question: string) {
		let data = {
			sk: question,
		};
		let len = base.isRegin == true ? reginKey.value : talkList.value.length - 1;
		talkList.value[len][1].searchList = [];
		api.searchRule(data).then((res) => {
			console.log(res, "777777");
			isNoSession.value = false;
			if (res.data) {
				nextTick(() => {
					base.isRuleUsed = true;
					talkList.value[len][1].isType = 8;
					talkList.value[len][1].isRun = true;
					// console.log(res.data.filepath);
					talkList.value[len][1].filepath = res.data.filepath;
					base.newTalk.filepath = res.data.filepath;
					getInterpret(question, res.data.description);
				});
			} else {
				base.isRuleUsed = false;
				if (isQAquestion.value) {
					typewriter(qAanswer.value.title, qAanswer.value.content);
					twoAfter();
				} else {
					getSearchAnswer(1, question);
				}
			}
		});
	}
	/**
	 * 查询海南政策文档解读动画效果
	 */
	function getInterpret(ques: string, des: string) {
		isRecom.value = false;
		let content = base.isRegin ?
			talkList.value[reginKey.value][0].content :
			questionCon.value;
		let len;
		if (talkList.value.length > 0) {
			len = talkList.value.length - 1;
		} else {
			len = 0;
		}
		isTwo.value = true;
		let list = ruleListHai();
		talkList.value[len][1].ruleListHai = list;
		talkList.value[len][1].isBeCreate = true;
		createCon.value = "使用：海南政策";
		console.log("000000000", list, talkList.value[len][1].isType);

		setTimeout(() => {
			createCon.value = "正在解读海南政策...";
			console.log("888888888888");
			isTwo.value = false;
			let index = 0;

			function showNextItem() {
				if (index < list.length) {
					createCon.value = "";
					createItem.value = `${list[index].title}：${list[index].description}`;
					index++;
					setTimeout(showNextItem, 500);
				} else {
					talkList.value[len][1].isBeCreate = false;
					typewriter(ques, des);
				}
			}
			showNextItem();
		}, 800);
	}
	/**
	 * 显示隐藏 海南政策解读过程
	 */
	function openRule(index: number) {
		talkList.value[index].forEach((item) => {
			if (item.identity == "assistant") {
				item.isShowRule = !item.isShowRule;
			}
		});
	}
	/**
	 * 查询是否有企业信息
	 * @parm sk 问题
	 * @parm type 1 QA答复 2 企业问题推荐
	 */
	function getSearchAnswer(type: number, question: string) {
		if (type == 1) {
			isQA.value = true;
		}
		let data = {
			sk: question,
			type: type,
		};
		// const regex = /你是[\u4e00-\u9fa5]+吗/;
		// const isMatch = regex.test(question);
		// if(isMatch){
		// 	data.type = 3;
		// }
		let len = base.isRegin == true ? reginKey.value : talkList.value.length - 1;
		talkList.value[len][1].searchList = [];
		api.searchAnswer(data).then((res) => {
			console.log(res, "777777", res.data);
			if (type != 2) {
				if (res.data) {
					typewriter(question, res.data.content);
				} else {
					getchattwo();
					fetchData();
				}
			} else {
				let list = res.data;
				if (list) {
					list.forEach((item) => {
						talkList.value[len][1].searchList.push(item);
					});
					searchQuesList.value = list;
				}
			}
		});
	}
	/**
	 * 企业 搜索答案
	 */
	function searchAnswerBy(row: any) {
		qAanswer.value = row;
		isQAquestion.value = true;
		questionCon.value = row.title;
		base.isEnterLoad = true;
		enterSession();
	}
	/**
	 * 打字机效果
	 */
	function typewriter(question: string, answer ? : string) {
		let len;
		if (base.isRegin == true) {
			len = reginKey.value;
		} else {
			len = talkList.value.length > 0 ? talkList.value.length - 1 : 0;
		}
		isTwo.value = false;
		isChat.value = true;
		isQA.value = true;
		let content = answer;
		base.newTalk.answer = answer;
		let index = 0;
		if (isBeStop.value == true) {
			base.newTalk.completion_tokens = 0;
			base.newTalk.total_tokens = 0;
			base.newTalk.prompt_tokens = 0;
			base.newTalk.answer = "已停止生成";
			base.newTalk.question = question;
			base.newTalk.relatelink = [];
			base.newTalk.searchList = [];
			questionCon.value = "";
			if (base.isRegin) {
				getRebuildchat();
			} else {
				chatthree();
			}
			return;
		}
		const intervalId = setInterval(() => {
			talkList.value[len][1].content += content[index];
			index++;
			if (isBeStop.value == true) {
				clearInterval(intervalId);
				console.log(talkList.value[len][1].content);
				base.newTalk.completion_tokens = 0;
				base.newTalk.total_tokens = 0;
				base.newTalk.prompt_tokens = 0;
				base.newTalk.answer = talkList.value[len][1].content;
				base.newTalk.question = question;
				base.newTalk.relatelink = [];
				base.newTalk.searchList = [];
				questionCon.value = "";
				if (base.isRegin) {
					getRebuildchat();
				} else {
					chatthree();
				}
			}
			if (index === content.length) {
				clearInterval(intervalId);
				base.newTalk.completion_tokens = 0;
				base.newTalk.total_tokens = 0;
				base.newTalk.prompt_tokens = 0;
				base.newTalk.question = question;
				base.newTalk.relatelink = [];
				base.newTalk.searchList = [];
				questionCon.value = "";
				if (base.isRegin) {
					getRebuildchat();
				} else {
					chatthree();
				}
			}
		}, 30); // 每个字符的间隔时间（毫秒）
	}
	/**
	 * 新建会话 第二步 建立会话 获取相关链接  同时请求两个接口
	 */
	const isChat = ref < boolean > (false);
	const isBeDoing = ref < boolean > (false);
	const contentBase = ref < string > ();
	const currentData = ref < any > ();
	const incompleteData = ref < string > ("");
	const isConnect = ref < boolean > (false);
	const isTypingStarted = ref < boolean > (false);
	const intervalSoket = ref < any > (null);
	const isSend = ref < boolean > (false);
	const isChatEnd = ref < boolean > (false);
	/***
	 **处理停止生成后的操作
	 ***/
	function stopProcessing() {
		// controller.abort();
		if (isStoping.value || isBeDoing.value == true) {
			return;
		}
		isStoping.value = true;
		if (isBeStop.value) {
			clearInterval(intervalSoket.value);
		}
		let list = fetchList.value;
		if (fetchList.value.length > 0) {
			let key = fetchList.value.length - 1;
			let database = "";
			fetchList.value.forEach((item) => {
				database += item.result;
			});
			let len =
				base.isRegin === true ? reginKey.value : talkList.value.length - 1;
			let basecontent =
				isBeStop.value == true ? talkList.value[len][1].content : database;
			reset({
				answer: basecontent,
				completion_tokens: fetchList.value[key].usage.completion_tokens,
				total_tokens: fetchList.value[key].usage.total_tokens,
				prompt_tokens: fetchList.value[key].usage.prompt_tokens,
			});
		} else {
			reset({
				answer: "已停止生成",
				completion_tokens: 0,
				total_tokens: 0,
				prompt_tokens: 0,
			});
		}
		console.log(fetchList.value, "目前得数据");
	}

	function reset(obj ? : any) {
		if (isBeDoing.value == true) {
			return;
		}
		isBeDoing.value = true;
		let len = base.isRegin == true ? reginKey.value : talkList.value.length - 1;
		isRecom.value = false;
		base.isEnterLoad = false;
		base.isWord = false;
		base.talkpage = 1;
		isChat.value = false;
		base.newTalk.answer = obj.answer;
		base.newTalk.completion_tokens = obj.completion_tokens;
		base.newTalk.total_tokens = obj.total_tokens;
		base.newTalk.prompt_tokens = obj.prompt_tokens;
		console.log("进来了吗@@@@@@@@@@@@", base.isRegin);

		if (base.isRegin) {
			getRebuildchat();
		} else {
			chatthree();
		}
	}
	/***
	 **定义开始打字机效果的函数
	 ***/
	function startTypingEffect() {
		isChat.value = true;
		base.isWord = true;
		if (isTypingStarted.value) {
			return;
		}
		isTypingStarted.value = true;
		let currentIndex = 0;

		function showNext() {
			if (isBeStop.value) {
				clearInterval(intervalSoket.value);
				return;
			}
			if (currentIndex <= fetchList.value.length - 1) {
				const jsonData = fetchList.value[currentIndex];
				const resultValue = jsonData.result;
				let len =
					base.isRegin === true ? reginKey.value : talkList.value.length - 1;
				if (!jsonData.typingStarted && resultValue) {
					jsonData.typingStarted = true;
					let index = 0;
					intervalSoket.value = setInterval(() => {
						if (isBeStop.value) {
							clearInterval(intervalSoket.value);
						}
						talkList.value[len][1].content += resultValue[index];
						index++;
						if (index === resultValue.length) {
							clearInterval(intervalSoket.value);
							if (!isBeStop.value) {
								currentIndex++;
								showNext();
							}
						}
					}, 30);
				} else {
					if (!isBeStop.value) {
						currentIndex++;
						showNext();
					}
				}
			} else {
				isTypingStarted.value = false;
			}
			console.log("当前:", currentIndex, "总数", fetchList.value.length);
		}
		showNext();
	}
	let controller = new AbortController();
	let signal = controller.signal;
	const tests = async () => {
		const data = {
			content: "声屏障",
		};
		const apiUrl = "https://voice.wireai.com/test";
		const response = await fetch(apiUrl, {
			method: "post",
			headers: {
				"Content-Type": "application/json",
			},
			body: JSON.stringify(data),
		});
		if (!response.ok) {
			throw new Error("Network response was not ok");
		}
		const reader = response.body.getReader();
		let decoder = new TextDecoder();
		let resultData = "";
		let result = true;
		while (result) {
			const {
				done,
				value
			} = await reader.read();
			if (done) {
				console.log("Stream ended");
				result = false;
				break;
			}
			console.log(decoder.decode(value));
		}
		// 监听数据流关闭
		await reader.closed;
		console.log("Stream closed");
	};
	/**
	 * 获取文心AI 回复
	 * 流式请求
	 * @parm query 问题
	 * @parm history 上下文历史记录
	 */
	async function fetchData() {
		// tests();
		contentBase.value = "";
		if (signal.aborted) {
			controller = new AbortController();
			signal = controller.signal;
		}
		// history.value.forEach(item => {

		// })
		let content = "";
		if (newContent.value) {
			isTwo.value = false;
			isBeStop.value = false;
			content = newContent.value;
		} else {
			content = base.newTalk.question;
		}
		const data = {
			query: content,
			// plugins: ["uuid-zhishiku"],
			// verbose: false,
			stream: true,
			history: history.value,
		};
		const apiUrl =
			"https://aip.baidubce.com/rpc/2.0/ai_custom/v1/wenxinworkshop/plugin/w9rwupkq7nsxfxw7/?access_token=" +
			chattoken.value;
		const response = await fetch(apiUrl, {
			method: "post",
			headers: {
				"Content-Type": "application/json",
			},
			signal: signal,
			body: JSON.stringify(data),
		});
		if (!response.ok) {
			throw new Error("Network response was not ok");
		}
		const reader = response.body.getReader();
		let decoder = new TextDecoder();
		let resultData = "";
		let result = true;
		while (result) {
			const {
				done,
				value
			} = await reader.read();
			if (done) {
				console.log("Stream ended");
				result = false;
				break;
			}
			if (isEnding.value == true || isBeStop.value == true) {
				stopProcessing();
				controller.abort();
				return;
			}
			console.log(decoder.decode(value));
			let dataString = decoder.decode(value);
			isSend.value = true;
			if (dataString.includes("error_code")) {
				reset({
					answer: "AI智能助手繁忙，稍后再试吧！",
					completion_tokens: 0,
					total_tokens: 0,
					prompt_tokens: 0,
				});
				return;
			}
			if (isBeStop.value == true) {
				stopProcessing();
				return;
			}
			if (!dataString.startsWith("data")) {
				dataString = incompleteData.value + dataString;
			}
			incompleteData.value = "";
			const regex = /{.*}/;
			const match = dataString.match(regex);
			console.log("match:::", match);
			if (match) {
				const jsonDataString = match[0];
				console.log("处理过的data:", jsonDataString);
				const data = JSON.parse(jsonDataString);
				incompleteData.value = dataString.slice(match.index + match[0].length);
				console.log(incompleteData.value == "" && data.is_end == true);
				if (
					(incompleteData.value == "" && data.is_end == true) ||
					isBeStop.value
				) {
					console.log("是否关闭");
					clearInterval(intervalSoket.value);
					if (isBeStop.value) {
						stopProcessing();
					}
				}
				fetchList.value.push(data);
				if (
					fetchList.value.length > 0 &&
					!isTypingStarted.value &&
					!isBeStop.value &&
					data.result
				) {
					startTypingEffect();
				}
				if (data.is_end == true) {
					stopProcessing();
					return;
				}
				//42
			} else {
				incompleteData.value = dataString;
				if (dataString.indexOf(`"is_end":true`) > 0) {
					setTimeout(() => {
						stopProcessing();
					}, 1000);
				}
			}
		}
		// 监听数据流关闭
		await reader.closed;
		stopProcessing();
		console.log("Stream closed");
	}
	const polishLoading = ref < boolean > (false);
	/**
	 * 问题 润色
	 * @parm content 问题
	 */
	function getExtendque() {
		polishLoading.value = true;

		let content = "";
		if (base.isCommand) {
			content = commendCon.value;
		} else {
			content = questionCon.value;
		}

		let data = {
			content: content,
		};
		pythonapi.extendque(data).then((res) => {
			isPolish.value = false;
			if (base.isCommand) {
				commendCon.value = res.result;
			} else {
				questionCon.value = res.result;
			}

			polishLoading.value = false;
			setTimeout(() => {
				isPolish.value = true;
				const range = document.createRange();
				const textNode = textarea.value.childNodes[0]; // 假设 <div> 内只有一个文本节点
				range.setStart(textNode, textNode.length - 1); // 设置范围为最后一个字符
				range.collapse(true); // 折叠范围到起始点
				const rect = range.getBoundingClientRect(); // 获取范围的位置信息
				console.log("最后一个字符的位置信息：", rect);
				polisStyle.value = {
					left: rect.left + 15,
					top: rect.top - 5,
				};
			}, 1000);
		});
	}
	/**
	 * 推荐问题
	 * @parm content 问题
	 */
	function getChatfour() {
		let len = base.isRegin == true ? reginKey.value : talkList.value.length - 1;
		recomQuesList.value = [];
		talkList.value[len][1].relatedList = [];
		let data = {
			content: base.newTalk.question,
		};
		// pythonapi.suggestque
		pythonapi.suggestque(data).then((res) => {
			let list = res.data.result;
			list.forEach((item) => {
				talkList.value[len][1].relatedList.push(item);
			});
			recomQuesList.value = list;
			isScrolling.value = false;
			scrollToBottom();
		});
	}
	/**
	 * 相关连接
	 * @parm content 问题
	 */
	function getchattwo() {
		isRecom.value = false;
		let content = base.isRegin ?
			talkList.value[reginKey.value][0].content :
			questionCon.value;
		base.newTalk.question = content;
		let len;
		if (base.isRegin == true) {
			len = reginKey.value;
		} else {
			if (talkList.value.length > 0) {
				len = talkList.value.length - 1;
			} else {
				len = 0;
			}
		}
		let data = {
			content: base.newTalk.question,
		};
		isTwo.value = true;
		let isConplete = false;
		try {
			// pythonapi.relatelink res.data.result
			pythonapi
				.relatelink(data)
				.then((res) => {
					isConplete = true;
					let list = res.data.result.slice(0, 5);
					questionCon.value = "";
					base.newTalk.relatelink = res.data.result.slice(0, 5);
					console.log(len);
					talkList.value[len][1].relatelink = res.data.result.slice(0, 5);
					if (list.length > 0) {
						talkList.value[len][1].isBeCreate = true;
						createCon.value = "正在尝试为您在互联网搜索相关资料...";
						setTimeout(() => {
							createCon.value = "正在获取资料...";
							isTwo.value = false;
							let index = 0;

							function showNextItem() {
								if (index < list.length) {
									createCon.value = "";
									createItem.value = `找到第${
					index + 1
				  }篇案例资料：<a target="_blank" href="${list[index].url}">${
					list[index].title
				  }</a>`;
									index++;
									if (isStop.value == true) {
										talkList.value[len][1].isBeCreate = false;
										base.newTalk.relatelink = [];
										talkList.value[len][1].relatelink = [];
										twoAfter();
									} else {
										setTimeout(showNextItem, 800);
									}
								} else {
									createItem.value = `一共找到了${list.length}篇资料，正在阅读...`;
									setTimeout(() => {
										talkList.value[len][1].isBeCreate = false;
									}, 800);
									if (isStop.value == true) {
										base.newTalk.relatelink = [];
										talkList.value[len][1].relatelink = [];
										twoAfter();
									}
								}
							}
							if (isStop.value == false) {
								showNextItem();
								// base.newTalk.relatelink = [];
								// talkList.value[len][1].relatelink = [];
								// talkList.value[len][1].isBeCreate = false;
							}
						}, 1000);
						setTimeout(() => {
							twoAfter();
						}, 1000);
					} else {
						isTwo.value = false;
						twoAfter();
					}
				})
				.error((res) => {
					console.log("2222接口请求失败", res);
				});
		} catch (error) {}
	}
	/**
	 * 新建会话 第二部完成后的操作
	 */
	function twoAfter() {
		if (base.isCurrenDel == false && isStop.value == false) {
			isSessionCon.value = false;
			if (isQAquestion.value == false) {
				getChatfour();
			}
			getSearchAnswer(2, base.newTalk.question);
		}
		if (isStop.value == true && isBeDoing.value == false) {
			base.newTalk.answer = "已停止生成";
			base.newTalk.completion_tokens = 0;
			base.newTalk.total_tokens = 0;
			base.newTalk.prompt_tokens = 0;
			base.newTalk.relatelink = [];
			base.isEnterLoad = false;
			base.isWord = false;
			isBeDoing.value = true;
			if (base.isRegin) {
				getRebuildchat();
			} else {
				console.log("停止33333333");
				chatthree();
			}
		}
	}
	/**
	 * 新建会话 第三步 入库
	 * @parm question 问题
	 * @parm sessionid 不存在0的情况
	 * @parm answer 回答
	 * @parm relatelink 相关链接
	 * @parm source 问答来源
	 * @parm completion_tokens 、total_tokens、prompt_tokens
	 *       根据文心接口返回 停止生成为0
	 */
	const isJoing = ref < boolean > (false);

	function chatthree() {
		console.log("进来了", base.newTalk.relatelink, base.newTalk.answer);
		if (isJoing.value == true) {
			return;
		}
		isJoing.value = true;

		let istype = base.isRuleUsed ? 8 : 0;
		let detail;
		if (istype == 8) {
			detail = base.newTalk.answer ? base.newTalk.answer : "已停止生成";
		} else {
			detail = base.newTalk.answer ?
				encodeURIComponent(base.newTalk.answer) :
				"已停止生成";
		}

		let content = "";
		if (newContent.value != "") {
			content = newContent.value;
			istype = 9;
		} else {
			content = base.newTalk.question;
		}
		let data = {
			question: content,
			userid: useStore.userIds,
			sessionid: base.inSessionId,
			answer: detail,
			completion_tokens: base.newTalk.completion_tokens,
			total_tokens: base.newTalk.total_tokens,
			prompt_tokens: base.newTalk.prompt_tokens,
			relatelink: JSON.stringify(base.newTalk.relatelink),
			source: qAanswer.value.company,
			jsoncontent: JSON.stringify(base.newTalk.filepath),
			isType: istype,
		};

		api.chatthree(data).then((res) => {
			let len = base.isRegin == true ? reginKey.value : talkList.value.length - 1;
			talkList.value[len][0].id = res.data.queid;
			talkList.value[len][1].id = res.data.answerid;
			beTalk.value = true;
			base.isRefresh = true;
			base.isEnterLoad = false;
			base.isWord = false;
			isBeStop.value = false;
			isConnect.value = false;
			isEnding.value = true;
			isPolish.value = false;
			talkList.value[len][1].nowId = res.data.answerid;
			talkList.value[len][1].sessionArr.push({
				content: base.newTalk.answer,
				type: 2,
				id: res.data.answerid,
			});
			let answer = base.newTalk.answer ? base.newTalk.answer : "已停止生成";
			if (answer != "已停止生成") {
				playAutio(answer, res.data.answerid);
			}
			// talkList.value[len][1].content = answer;
			qAanswer.value = "";
			isQAquestion.value = false;
			stopRuning();
			setTimeout(() => {
				isJoing.value = false;
			}, 1500);
		});
	}
	/**
	 * 停止生成 loading设置
	 */
	function stopRuning() {
		talkList.value.forEach((GropItem) => {
			if (GropItem) {
				GropItem.forEach((item) => {
					item.isRun = false;
				});
			}
		});
	}
	/**
	 * 重新生成处理
	 */
	const reginId = ref < boolean > ();

	function getchatRebuild(index: number, id: number) {
		base.isRegin = true;
		isStop.value = false;
		reginKey.value = index;
		reginId.value = id;
		contentBase.value = "";
		recomQuesList.value = [];
		talkList.value.forEach((item, k) => {
			if (k == index) {
				item[1].isRun = true;
				base.isEnterLoad = true;
				item[1].content = "";
				item[1].isBeCreate = false;
				item[1].relatelink = "";
				item[1].relatedList = [];
				item[1].searchList = [];
				item[1].isShowLink = false;
			}
		});
		createSession();
	}
	/**
	 * 重新生成的数据保存
	 * @parm id 当前会话记录id 不是 sessionid
	 * 其它参数同理第一次保存入库
	 */
	function getRebuildchat() {
		let data = {
			id: reginId.value,
			sessionid: base.inSessionId,
			userid: useStore.userIds,
			content: encodeURIComponent(base.newTalk.answer),
			completion_tokens: base.newTalk.completion_tokens,
			total_tokens: base.newTalk.total_tokens,
			prompt_tokens: base.newTalk.prompt_tokens,
			relatelink: JSON.stringify(base.newTalk.relatelink),
		};
		api.rebuildchat(data).then((res) => {
			base.isRegin = false;
			let num = reginKey.value;
			let newcontent = base.newTalk.answer ? base.newTalk.answer : "已停止生成";
			talkList.value[num].forEach((item) => {
				if (item.identity == "assistant") {
					item.sessionArr.push({
						content: newcontent,
						type: 2,
						id: res.data,
					});
					item.content = newcontent;
					item.key = item.sessionArr.length;
					item.count = item.sessionArr.length;
					item.relatedList = recomQuesList.value;
					item.searchList = searchQuesList.value;
					item.nowId = res.data;
					item.nowtaskId = "";
				}
			});
			// id: res.data.answerid,
			base.isEnterLoad = false;
			base.isWord = false;
			isBeStop.value = false;
			isEnding.value = true;
			playAutio(newcontent, res.data);
			setTimeout(() => {
				// getSessionCon();
				stopRuning();
			}, 1500);
		});
	}

	function getMoreList() {
		base.listpage++;
		getSessionlist();
	}
	/**
	 * 会话列表
	 * @parm title 搜索关键字
	 */
	function getSessionlist() {
		let data = {
			userid: useStore.userIds,
			page: base.listpage,
			title: base.keyword,
		};
		if (base.listpage == 1) {
			base.sessionlist = [];
		}
		api.newsessionlist(data).then((res) => {
			let list = res.data.sessionlist;
			base.listCount = res.data.count;
			base.sessionlist = [...base.sessionlist, ...list];
			base.listLoad = false;
			if (list.length < 50) {
				base.noMoreDataList = true;
			}
			if (list.length > 0) {
				base.isNone = false;
			} else {
				base.isNone = true;
			}
			if (isCurrent.value == true) {
				const hasIstop = base.sessionlist.some((item) => item.istop === 1);
				const resultId = hasIstop ?
					base.sessionlist.find((item) => item.istop === 0) :
					base.sessionlist[0];
				talkList.value = [];
				temporary(resultId.id);
				isCurrent.value = false;
			}
		});
	}
	/**
	 * 初始化会话
	 */
	function temporary() {
		base.isNewSess = false;
		let content = "";

		let obj = [{
				identity: "user",
				content: content,
				rebuild: [],
				isType: 1,
			},
			{
				identity: "assistant",
				isRun: true,
				content: "",
				rebuild: [],
				question: "",
				relatelink: "",
				relatedList: [],
				key: 1,
				sessionArr: [],
				count: 0,
				isBeCreate: false,
				isType: 1,
			},
		];
		if (newContent.value) {
			//  content = newContent.value;
			obj[0].isType = 9;
			obj[0].content = newContent.value;
		} else {
			// content = questionCon.value;
			obj[0].content = questionCon.value;
		}
		if (isQAquestion.value == true) {
			obj[1].source = qAanswer.value.company;
		}
		talkList.value.push(obj);
		base.isEnterLoad = true;
		setTimeout(() => {
			isScrolling.value = false;
			scrollToBottom();
		}, 200);
	}
	/**
	 * 获取会话信息
	 * @parm sessionid
	 */
	const isNoSession = ref < boolean > (false);

	function getSessionCon() {
		clearTimeout(processTimeout.value);
		isSessionCon.value = true;
		isNoSession.value = false;
		if (!beTalk.value) {
			talkList.value.forEach((GropItem) => {
				GropItem = GropItem || [];
				GropItem.forEach((item) => {
					if (item.identity == "assistant") {
						item.relatedList = [];
						item.searchList = [];
					}
				});
			});
		}
		if (base.isSwich == true) {
			talkList.value = [];
		}
		if (audioRef.value) {
			audioRef.value.pause();
		}
		// talkList.value.forEach(item=>{
		// 	let list = item;
		// 	list.forEach(item2=>{
		// 		item2.isPlay = false;
		// 		item2.isRun = false;
		// 	})
		// })
		let data = {
			userid: useStore.userIds,
			sessionid: base.inSessionId,
			page: base.talkpage,
		};
		api.chathistorytest(data).then((res) => {
			clearInterval(intervalSoket.value);
			isNoSecurity.value = false;
			let list = res.data;

			if (res.data.length < 3) {
				base.isNohistory = true;
				if (base.talkpage > 1) {
					base.noMoreDataTalk = true;
				}
			} else {
				base.isNohistory = false;
			}
			list.forEach((gropItem, index) => {
				gropItem.forEach((item) => {
					if (item.identity == "user") {
						let firstLi = item;
						// if (firstLi && firstLi.content === '声屏障产品的种类有哪些，围绕转型升级应用了哪些新技术？') {
						// 	secondLi.isVoice = true;
						// }
					}
					if (item.identity == "assistant") {
						let secondLi = item;
						if (
							secondLi.isType == 8 &&
							secondLi.jsoncontent &&
							secondLi.jsoncontent != null
						) {
							let jsondata = JSON.parse(secondLi.jsoncontent);
							secondLi.filepath = jsondata;
						}
						if (secondLi.jsoncontent && secondLi.isType != 8) {
							let jsondata = JSON.parse(secondLi.jsoncontent);
							secondLi.companylist = jsondata.companylist;
							secondLi.companyids = jsondata.companyids;
							secondLi.infoData = jsondata.infoData;
							secondLi.classid = jsondata.classid;
							secondLi.remark = jsondata.remark;
						}
						if (index === 0 && currentId.value === base.inSessionId) {
							secondLi.relatedList = recomQuesList.value;
							secondLi.searchList = searchQuesList.value;
						} else {
							secondLi.relatedList = [];
							secondLi.searchList = [];
						}
						if (secondLi.relatelink) {
							secondLi.relatelink = JSON.parse(secondLi.relatelink) || [];
						}
						let arr = [];
						let obj = {
							content: decodeKey(secondLi.content, secondLi.isType),
							id: secondLi.id,
							type: 1,
							oldcontent: decodeKey(secondLi.content, secondLi.isType),
							voice: secondLi.voice,
							task_id: secondLi.task_id,
						};
						arr.push(obj);
						if (secondLi.rebuild && secondLi.rebuild.length > 0) {
							secondLi.rebuild.forEach((item2) => {
								let obj = {
									content: decodeKey(item2.content, secondLi.isType),
									id: item2.id,
									type: 2,
									oldcontent: decodeKey(item2.content, secondLi
										.isType),
									task_id: item2.task_id,
									voice: item2.voice,
								};
								arr.push(obj);
							});
						}
						secondLi.sessionArr = arr;
						secondLi.isShowLink = true;
						secondLi.content = decodeKey(
							secondLi.sessionArr[0].content,
							secondLi.isType
						);
						secondLi.key = 1;
						secondLi.isBeCreate = false;
						secondLi.count = (secondLi.rebuild ? secondLi.rebuild.length : 0) + 1;
						secondLi.nowId = secondLi.id;
						secondLi.nowtaskId = secondLi.task_id;
						if (isPlayAudio.value) {
							secondLi.audioplay = true;
						}
					}
				});
			});
			if (base.isRefresh == true) {
				talkList.value = [...list];
			} else {
				talkList.value = [...list, ...talkList.value];
			}
			base.talkLoad = false;
			base.isNewSess = false;
			base.isSwich = false;
			base.isRefresh = false;
			let counts = talkList.value.length - 1;
			if (talkList.value.length > 0) {
				talkList.value[counts].forEach((item) => {
					if (item.task_id && !item.voice) {
						console.log("aaaaaaaaa", item.task_id, item.voice);
						generateVoice(counts, item.task_id);
					}
				});
			}
			if (base.talkpage == 1 && base.isRegin == false) {
				setTimeout(() => {
					scrollToBottom();
				}, 200);
			} else {
				console.log(
					chatContent.value.scrollTop,
					",",
					chatBox.value.offsetHeight,
					",",
					lastScrollHeight.value
				);
				chatContent.value.scrollTop =
					chatBox.value.offsetHeight - lastScrollHeight.value;
				console.log(chatContent.value.scrollTop);
			}
			if (list.length == 0) {
				isNoSession.value = true;
			} else {
				isNoSession.value = false;
			}
		});
	}

	function scrollToBottom() {
		if (!isScrolling.value) {
			chatContent.value.scrollTop =
				chatContent.value.scrollHeight - chatContent.value.offsetHeight;
		}
	}

	function handleScroll() {
		const scrollContainer = chatContent.value;
		const scrollTop = scrollContainer.scrollTop;
		const scrollHeight = scrollContainer.scrollHeight;
		const offsetHeight = scrollContainer.offsetHeight;
		if (scrollTop + offsetHeight < scrollHeight) {
			isScrolling.value = true;
		} else {
			isScrolling.value = false;
		}
		if (chatBox.value) {
			lastScrollHeight.value = chatBox.value.offsetHeight;
		}
		// console.log(scrollTop)
		if (scrollTop == 0 && !base.isNohistory && base.isNewSess == false) {
			console.log("top", scrollTop, "height", offsetHeight);
			if (base.isEnterLoad == true) {
				// setTimeout(()=>{
				// 	if(base.is)
				// 	base.talkpage ++;
				// 	base.talkLoad = true;
				// 	getSessionCon();
				// 	console.log('加载一下页')
				// },300)
			}
		}
	}
	const textarea = ref(null);
	const polish = ref(null);

	function adjustTextareaHeight(event) {
		const textarea = event.target;
		if (textarea.value.length > 1000) {
			textarea.value = textarea.value.slice(0, 1000);
		}
		if (base.isMobile || textarea.value) {
			textarea.style.height = "auto"; // 先将高度设置为自动以确保能够正确计算滚动高度
			textarea.style.height = textarea.scrollHeight + "px"; // 设置实际高度
		}
	}
	const isPolish = ref < boolean > (false);
	let timer;
	const polisStyle = ref < any > ({});
	const isFocus = ref < boolean > (false);

	function textFocus() {
		console.log(1288, textarea.value.innerText);
		isFocus.value = true;
		if (questionCon.value == "请输入问题，可通过shift+回车换行") {
			questionCon.value = "";
			isPolish.value = false;
		}
		if (questionCon.value != "") {
			isTextInput.value = !isTextInput.value;
		}
		if (commendCon.value == "请对指令进行具体的主题描述") {
			commendCon.value = "";
			isPolish.value = false;
		}
		if (commendCon.value != "") {
			isTextInput.value = !isTextInput.value;
		}
	}

	function blurFocus() {
		// console.log(questionCon.value,textarea.value.innerText)
		questionCon.value = textarea.value.innerText;
		commendCon.value = textarea.value.innerText;
		if (
			(questionCon.value == "" && pastedText.value == "") ||
			textarea.value.innerText == ""
		) {
			questionCon.value = "请输入问题，可通过shift+回车换行";
			isFocus.value = false;
			isPolish.value = false;
		} else {
			isTextInput.value = !isTextInput.value;
		}
		if (
			(commendCon.value == "" && pastedText.value == "") ||
			textarea.value.innerText == ""
		) {
			commendCon.value = "请对指令进行具体的主题描述";
			isFocus.value = false;
			isPolish.value = false;
		} else {
			isTextInput.value = !isTextInput.value;
		}
	}
	const pastedText = ref < string > ("");

	function handlePaste(event) {
		pastedText.value = (event.clipboardData || window.clipboardData).getData(
			"text"
		);
		// questionCon.value = pastedText;
	}

	function adjustTextHeight(event) {
		if (event.data == null) {
			isPolish.value = false;
			// return;
		}
		if (!base.isHaiRule) {
			const range = document.createRange();
			const textNode = textarea.value.childNodes[0]; // 假设 <div> 内只有一个文本节点
			range.setStart(textNode, textNode.length - 1); // 设置范围为最后一个字符
			range.collapse(true); // 折叠范围到起始点
			const rect = range.getBoundingClientRect(); // 获取范围的位置信息
			console.log("最后一个字符的位置信息：", rect);
			polisStyle.value = {
				left: rect.left + 15,
				top: rect.top - 5,
			};
		}

		const data = textarea.value.innerText;
		if (event.data == null || event.data) {
			isPolish.value = false;
		}
		if (data > 1000) {
			textarea.value.innerText = data.slice(0, 1000);
		}
		pastedText.value = "";
		// questionCon.value = data;
		console.log(textarea.value.innerText);

		if (textarea.value.innerText) {
			clearTimeout(timer);
			timer = setTimeout(() => {
				isPolish.value = true;
			}, 500);
		} else {
			clearTimeout(timer);
		}
	}
	/*
	 * 键盘enter 发送会话
	 */
	function handleKeyDown() {
		base.isRegin = false;
		if (base.isWord == true) {
			event.preventDefault();
		}

		if (event.key === "Enter" && !event.shiftKey) {
			console.log(questionCon.value);
			if (base.isCommand) {
				if (commendCon.value.length + base.curCommand.command.length > 600) {
					ElMessage.error("指令过长，请重新输入");
					return;
				}
			}
			if (!commendCon.value && textarea.value.innerText) {
				commendCon.value = textarea.value.innerText;
			}
			if (!questionCon.value && textarea.value.innerText) {
				questionCon.value = textarea.value.innerText;
			}
			if (questionCon.value || commendCon.value) {
				let isShowPop = false;
				talkList.value.forEach((gropItem) => {
					gropItem.forEach((item) => {
						console.log(item.isType);
						if (item.isType != 1 && item.isType != 8 && item.isType != 0 && item.isType != 9) {
							isShowPop = true;
						}
					});
				});
				if (base.sessionType == 2 || isShowPop == true) {
					isShowSession.value = true;
					return;
				}
				createSession();
			}
			event.preventDefault();
		}
	}
	/**
	 * 获取音频文件
	 * @parm id 会话记录Id
	 */
	function playAutio(content: string, id: number, num: number) {
		const parser = new DOMParser();
		const doc = parser.parseFromString(content, "text/html");
		const plainTextContent = doc.body.textContent || "";

		let data = {
			id: id,
			content: plainTextContent,
		};
		api.getvoicefile(data).then((res) => {
			console.log(res);
			let k = !num ? talkList.value.length - 1 : num;
			if (talkList.value[k][1].sessionArr.length > 0) {
				let arr = talkList.value[k][1].sessionArr;
				arr.forEach((item) => {
					if (item.id == id) {
						item.task_id = res.data.task_id;
					}
				});
			}
			talkList.value[k].forEach((item) => {
				if (item.identity == "assistant") {
					item.task_id = res.data.task_id;
					item.nowtaskId = res.data.task_id;
				}
			});
			if (res.data.task_status == "Created") {
				talkList.value[k].forEach((item) => {
					if (item.identity == "assistant") {
						item.voice = "";
					}
				});
				generateVoice(k, res.data.task_id);
			}
		});
	}
	/*
	 *添加定时器 生成音频
	 */
	const intervalVoice = ref < any > (null);

	function generateVoice(k: number, id: string) {
		intervalVoice.value = setInterval(() => {
			checkStatus(k, id);
		}, 6000);
	}
	/**
	 * 生成音频状态
	 * @parm task_id 任务id
	 */
	async function checkStatus(k: number, id: string) {
		let data = {
			task_id: id,
		};
		let res = await api.getvoicestatus(data);
		if (res.code == 200) {
			talkList.value[k].forEach((item) => {
				if (item.identity == "assistant") {
					item.voice = res.data.voice;
				}
			});
			clearInterval(intervalVoice.value);
		}
	}
	/*
	 * 关闭所有音频
	 */
	function closeAllvoice() {
		if (audioRef.value) {
			audioRef.value.pause();
		}
		talkList.value.forEach((GridItem) => {
			GridItem.forEach((item) => {
				item.audioplay = false;
			});
		});
	}
	const audioRef = ref < HTMLAudioElement | null > (null);
	/**
	 * 控制音频 播放暂停
	 * @parm task_id 任务id
	 */
	async function voicestatus(k: number, id: string) {
		let stopplay = false;
		talkList.value.forEach((Gropitem) => {
			Gropitem.forEach((item) => {
				if (item.audioplay == true) {
					stopplay = true;
					closeAllvoice();

					if (audioRef.value) {
						audioRef.value.pause();
					}
					return;
				}
			});
		});
		if (stopplay) {
			return;
		} else {
			talkList.value.forEach((GropItem, index) => {
				GropItem.forEach((item) => {
					item.audioplay = false;
				});
			});
			if (audioRef.value) {
				audioRef.value.pause();
			}
		}
		let data = {
			task_id: id,
		};
		await api.getvoicestatus(data).then((res) => {
			console.log(res);
			if (res.code == 200) {
				console.log(res, "9999");
				clearInterval(intervalVoice.value);
				audioSrc.value = res.data.voice;
				talkList.value[k][1].audioplay = true;
				audioRef.value = new Audio(audioSrc.value);
				audioRef.value.play();
				audioRef.value.currentTime = 0;
				autioCallBack(k);
			}

			if (res.code == 201) {
				console.log("生成中");
			}
		});
	}

	function autioCallBack(k: number) {
		audioRef.value.addEventListener("ended", () => {
			talkList.value[k][1].audioplay = false;
		});
		audioRef.value.addEventListener("error", () => {
			talkList.value[k][1].audioplay = false;
		});
	}
	const isPlayAudio = ref < boolean > (false);
	/***
	 * 弃用
	 */
	function onAudioEnded() {
		console.log("监听结束");
		talkList.value.forEach((item, k) => {
			let list = item;
			list.forEach((item2) => {
				item2.audioplay = false;
				item2.isRun = false;
			});
		});
		isPlayAudio.value = false;
	}
	onBeforeUnmount(() => {
		console.log("销毁");
		if (audioRef.value) {
			audioRef.value.pause();
		}
	});

	// 张--
	const pdfMessagae = ref < any > ();
	const isType = ref < any > (); //什么类型的
	function temporaryPdf(a, b) {
		base.isNewSess = false;
		let obj = [{
				identity: "user",
				content: "",
				...a,
			},
			{
				identity: "assistant",
				isRun: true,
				content: "",
				question: "",
				isBeCreate: false,
				isStatus: 0, //0上传图片中 1 已完毕开始解析
				...b,
			},
		];
		if (a.isShow) {
			obj = [{
				identity: "assistant",
				isRun: true,
				content: "",
				question: "",
				isBeCreate: false,
				isStatus: 0, //0上传图片中 1 已完毕开始解析
				...b,
			}, ];
		}

		talkList.value.push(obj);
		base.isEnterLoad = true;
		setTimeout(() => {
			isScrolling.value = false;
			scrollToBottom();
		}, 200);
	}

	// 文档上传
	const filesInfo = ref < any > ({
		fileId: "",
		filepath: "",
	});

	function onSuccessPlugins(el) {
		if (base.sessionType == 2 || base.inSessionId == 0) {
			base.sessionType = 0;
			base.isNewSess = false;
		}
		console.log(el, "我是接受到的数据");
		// pdfMessagae.value = el.fileName
		// el.type 代表的是当前文件进度 0 1 上传文件  2--解读文档
		if (el.type == 0) {
			console.log("上传图片中");
			temporaryPdf({
				isType: 2,
				content: el.fileName,
				infoData: el.data,
				classid: el.classid,
			}, {
				isType: 2,
				content: "",
				isStatus: 0, //解析状态
				classid: el.classid,
				infoData: el.data,
				companylist: [], //公司列表
				companyids: [], //选中的公司列表
				remark: "",
			});
		} else if (el.type == 1) {
			talkList.value[talkList.value.length - 1][1].isStatus = 1;
			talkList.value[talkList.value.length - 1][1].infoData = el.data;
			base.inSessionId = el.data.sessionid;
			sendBaoJiaSubmit(el.classid);
			getSessionlist();
		}
	}

	/**
	 * 打字机效果
	 */
	function typewriterPdf(question: string, answer: string, callback) {
		let len;
		if (base.isRegin == true) {
			len = reginKey.value;
		} else {
			len = talkList.value.length > 0 ? talkList.value.length - 1 : 0;
		}
		isChat.value = true;
		let content = answer ? answer : defaultReply;
		let index = 0;
		const intervalId = setInterval(() => {
			talkList.value[len].forEach((item) => {
				if (item.identity == "assistant") {
					item.content += content[index];
				}
			});
			index++;
			if (index === content.length) {
				console.log("打字机效果结束");
				clearInterval(intervalId);
				callback();
			}
		}, 30); // 每个字符的间隔时间（毫秒）
	}
	/**
	 * 获取目录分类
	 */
	const menuClassList = ref < any > ();

	function getclasslist() {
		pdfapi.getclasslist({}).then((res) => {
			console.log(res);
			menuClassList.value = res.data;
		});
	}
	const quotation = ref < any > ();
	// 发送报价单
	function sendBaoJiaSubmit(classid: any) {
		pdfapi.getcompanylist({
			classid: classid
		}).then((res) => {
			console.log(res);
			quotation.value = res.data;
			talkList.value[talkList.value.length - 1].forEach((item) => {
				if (item.identity == "assistant") {
					item.id = res.data;
					item.companylist = res.data.companylist;
				}
			});
			historyRecord(2);
			// 开启自己效果
			typewriterPdf("", res.data.msg, function() {
				resetRun({
					isRun: false
				});
				base.isEnterLoad = false;
			});
		});
	}

	function resetRun(obj) {
		talkList.value[talkList.value.length - 1].forEach((item) => {
			if (item.identity == "assistant") {
				item.isRun = false;
				// = { ...item, ...obj };
				console.log("我停止了", item);
			}
		});
	}

	function historyRecord(type: number) {
		let dataJson = {},
			content = "";
		if (type == 2) {
			dataJson = {
				companylist: quotation.value.companylist,
				companyids: [],
				infoData: talkList.value[talkList.value.length - 1][1].infoData,
				classid: talkList.value[talkList.value.length - 1][1].classid,
				issend: 0,
				remark: talkList.value[talkList.value.length - 1][1].remark || "",
			};
			content = quotation.value.msg;
		} else if (type == 3) {
			dataJson = {
				companylist: quotation.value.companyinfo,
				issend: 2,
				remark: quotation.value.remark,
			};
			content = quotation.value.msg2;
		}
		let data = {
			userid: useStore.userIds,
			sessionid: base.inSessionId,
			identity: "assistant",
			content: content,
			isrequest: 0,
			issend: 0, //发送报价状态0不需要1需要2已完毕
			jsoncontent: JSON.stringify(dataJson),
			isType: type,
		};
		pdfapi.completehistoryrecord(data).then((res) => {
			console.log("保存成功");
			talkList.value[talkList.value.length - 1].forEach((item) => {
				if (item.identity == "assistant") {
					item.id = res.data;
				}
			});
			console.log(talkList.value, "最新数据");
			// talkList.value[talkList.value.length - 1][1].id = res.data;
		});
	}
	/**
	 * 提交确认报单
	 */
	function sendSumbitDetail(item, k: number) {
		console.log(item);
		let data = {
			userid: useStore.userIds,
			companyids: item.companyids.join(","),
			classid: item.classid,
			filepath: item.infoData.filepath,
			filename: item.infoData.filename,
			remark: item.remark || "",
		};
		temporaryPdf({
			isShow: true,
		}, {
			isType: 3,
			content: "",
			identity: "assistant",
			classid: item.classid,
			infoData: item.data,
			companylist: [], //公司列表
			isShowLink: true,
		});
		console.log(talkList.value, "000000000");
		changeIssend(item.id, k);
		pdfapi.getoffer(data).then((res) => {
			console.log(res);
			quotation.value = res.data;
			talkList.value[talkList.value.length - 1].forEach((item) => {
				if (item.identity == "assistant") {
					item.issend = 2;
					item.companylist = res.data.companyinfo;
					item.remark = res.data.remark;

					historyRecord(3);
					typewriterPdf("", res.data.msg2, function() {
						item.isRun = false;
						base.isEnterLoad = false;
					});
				}
			});
			// talkList.value[talkList.value.length - 1][1].companylist = res.data.companyinfo;
			// 开启自己效果
		});
	}

	function changeIssend(id: number, k: number) {
		let data = {
			id: id,
			issend: 3,
		};
		pdfapi.updateisend(data).then((res) => {
			talkList.value[k].forEach((item) => {
				if (item.identity == "assistant") {
					item.issend = 3;
				}
			});
		});
	}

	function isBaoHan(ite: any, list: any) {
		return list.includes(ite);
	}
	// 多选
	function selectMulter(ite: any, item: any) {
		console.log(ite, item);
		const index = item.companyids.indexOf(ite.id);

		if (index !== -1) {
			item.companyids.splice(index, 1);
		} else {
			// 如果ID不存在于数组中，则添加它
			item.companyids.push(ite.id);
		}
	}
	const dialogS = ref < any > ({
		visble: false,
		item: "",
		infoData: "",
		style: "",
	});

	function sendCompany(item: any, itemCur: any, event: any) {
		console.log(item, event);
		dialogS.value.visble = true;
		dialogS.value.item = itemCur;
		dialogS.value.infoData = item;
		dialogS.value.style = {
			top: event.layerY,
			left: event.layerX,
		};
	}

	function dialCancel() {
		dialogS.value.visble = false;
		dialogS.value.item = "";
		dialogS.value.infoData = "";
		dialogS.value.style = "";
	}

	function dialSubmit() {
		questionCon.value = dialogS.value.infoData.title;
		console.log("开启新的聊天", dialogS.value.infoData);

		isShowSession.value = false;
		talkList.value = [];
		base.inSessionId = 0;
		base.sessionType = 0;
		base.isRegin = false;
		createSession();
	}
	// ai计算器的回调方法
	function onSendCalculator() {
		base.sessionType = 2;
		base.inSessionId = 0;
		base.isNewSess = true;
	}

	onMounted(() => {
		// 张-
		getclasslist();

		// fetchpdf();
		if (audioRef.value) {
			audioRef.value.pause();
		}
		console.log(base.inSessionId);
		console.log(base.isNewSess);

		if (base.inSessionId == 0 && base.isNewSess) {
			getSessionlist();
		}
		if (chatContent.value) {
			chatContent.value.addEventListener("scroll", handleScroll);
		}
		const width = window.innerWidth;
		if (width < 768) {
			base.isMobile = true;
		}
		window.addEventListener("click", (e) => {
			dialCancel();
		});
		window.addEventListener("resize", function() {
			const width = window.innerWidth;
			if (width < 768) {
				base.isMobile = true;
			} else {
				base.isMobile = false;
			}
		});
	});
</script>
<style lang="scss" scoped>
	.commandInput {
		border: 0;
		width: 726px;
		z-index: 99999999;
		line-height: 22px;
		position: relative;
		outline: none;
		font-family: "siyuanR";
		color: #5f7298;
		font-size: 14px;
		height: 22px;
	}

	.clearfix:after {
		content: "";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
	}

	.show {
		display: block;
	}

	.flexC {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.no-scroll textarea {
		overflow: hidden;
		/* 禁用滚动条 */
		resize: none;
		/* 禁止用户手动调整文本框的尺寸 */
		height: auto !important;
		/* 强制将高度设置为自适应 */
		max-height: none !important;
		/* 禁用最大高度限制 */
	}

	.box {
		width: 100%;
		display: flex;
		height: 100vh;
		overflow: hidden;
		font-size: 14px;
	}

	.record {
		width: 280px;
		height: 100vh;
		background: url(../../assets/images/leftbg.png) no-repeat 60px -40px #f8f9fa;
		background-size: 403px 214px;
		padding: 20px 0;

		.logo {
			margin: 0 20px;

			img {
				width: 96px;
			}
		}

		.btnAdd {
			margin: 40px 15px 20px;
			color: #4955f5;
			width: 120px;
			height: 40px;
			cursor: pointer;
			background-image: linear-gradient(90deg, #99e3e0, #afcefe);
			position: relative;
			border-radius: 8px;

			&.disable {
				opacity: 0.6;
				cursor: default;
			}

			i {
				position: relative;
				z-index: 10;
				font-style: normal;
				background: linear-gradient(90deg, #0ac1ba, #2379ff);
				-webkit-background-clip: text;
				-webkit-text-fill-color: transparent;
				color: transparent;
				font-size: 16px;
				transition: all 0.5s;
			}

			&:hover:not(.disable) {
				i {
					color: #fff;
					background: none;
					-webkit-text-fill-color: #fff;
				}
			}

			&::after {
				content: "";
				position: absolute;
				background: #fff;
				left: 2px;
				top: 2px;
				width: calc(100% - 4px);
				height: calc(100% - 4px);
				border-radius: 6px;
			}

			&:hover:not(.disable)::after {
				background-image: linear-gradient(90deg, #0ac1ba, #2379ff);
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
				border-radius: 8px;
			}
		}

		.serchBox {
			border-top: solid 2px #ecf0f4;
			border-bottom: solid 2px #ecf0f4;
			height: 50px;
			width: calc(100% - 20px);
			margin: 0 10px;
			background: url(../../assets/images/icon_search.png) no-repeat 25px center;
			background-size: 14px 14px;

			.text {
				width: 100%;
				background: none;
				height: 100%;
				padding: 0 25px 0 50px;
				outline: none;
				color: #666666;

				&::-webkit-input-placeholder {
					color: #b4bec9;
				}
			}
		}

		.deleteBox {
			width: 100%;
			height: 40px;
			padding: 0 20px;
			line-height: 40px;
			position: relative;

			&::before {
				position: absolute;
				top: 0;
				width: calc(100% - 20px);
				left: 10px;
				height: 2px;
				background: #ecf0f4;
				content: "";
			}

			.retract {
				background: url(../../assets/images/retract.png) no-repeat;
				background-size: 100%;
				width: 33px;
				height: 58px;
				position: absolute;
				right: -20px;
				top: 20px;
				transform: translateY(-50%);
				z-index: 99;
				cursor: pointer;
			}

			.close {
				float: right;
				background: url(../../assets/images/close02.png) no-repeat right center;
				background-size: 8px 8px;
				position: relative;
				padding-left: 20px;
				width: 10px;
				height: 100%;
				cursor: pointer;

				&::after {
					content: "";
					top: 50%;
					transform: translateY(-50%);
					position: absolute;
					width: 2px;
					height: 10px;
					background: #c9cad7;
					left: 0;
				}
			}

			.checkAll {
				color: #267bf7;
				position: relative;
				padding: 0 15px 0 18px;
				margin-right: 10px;
				display: block;
				float: left;
				cursor: pointer;

				&::before,
				&::after {
					content: "";
					top: 50%;
					transform: translateY(-50%);
					position: absolute;
				}

				&::before {
					width: 10px;
					height: 10px;
					border: solid 1px #267bf7;
					border-radius: 50%;
					left: 0;
				}

				&.active::before {
					background: #267bf7;
				}

				&::after {
					width: 2px;
					height: 10px;
					background: #c9cad7;
					right: 2px;
				}
			}

			.delete {
				display: block;
				float: left;
				color: #9094b0;
				font-size: 12px;
				background: url(../../assets/images/delete.png) no-repeat left center;
				background-size: 12px 13px;
				padding-left: 20px;
				line-height: 40px;
				cursor: pointer;

				&.disable {
					cursor: default;
					opacity: 0.5;
				}

				&.active {
					background: url(../../assets/images/delete02.png) no-repeat left center;
					background-size: 12px 13px;
				}
			}
		}

		.nolistdata {
			padding: 0 10px;
			color: #b4bec9;
		}

		.list {
			width: 100%;
			padding: 15px 0;
			max-height: calc(100vh - 320px);
			overflow-y: scroll;
			position: relative;

			&:hover::-webkit-scrollbar {
				width: 3px;
			}

			.itemTitle {
				width: 100%;
				padding: 0 10px;
				height: 50px;
				position: relative;

				&.topItem {
					background: #eef0f1;
				}
			}

			.listItem {
				width: 100%;
				padding-left: 36px;
				height: 50px;
				box-sizing: border-box;
				line-height: 50px;
				font-size: 14px;
				border-radius: 8px;
				cursor: pointer;
				position: relative;
				color: #666666;

				&::before {
					background: url(../../assets/images/icon_message.png) no-repeat;
					background-size: 100%;
					width: 16px;
					height: 16px;
					position: absolute;
					left: 10px;
					top: 50%;
					transform: translateY(-50%);
					content: "";
					border-radius: 50%;
				}

				&.disable::before {
					display: none;
				}

				.checkBtn {
					position: absolute;
					left: 0;
					top: 0;
					width: 36px;
					height: 100%;

					&::before {
						width: 10px;
						height: 10px;
						border: solid 1px #267bf7;
						border-radius: 50%;
						position: absolute;
						left: 10px;
						top: 50%;
						margin-top: -5px;
						content: "";
					}

					&.active::before {
						background: #267bf7;
					}
				}

				.editTitle {
					position: absolute;
					left: 0;
					top: 0;
					width: 100%;
					height: 100%;
					background: #fff;
					border: solid 1px #4955f5;
					border-radius: 8px;

					.text {
						width: 100%;
						height: 100%;
						background: none;
						outline: none;
						padding: 0 10px;
					}
				}

				.title {
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
					width: 100%;
					height: 100%;
					display: block;
				}

				.del,
				.top,
				.edit {
					width: 18px;
					height: 18px;
					position: absolute;
					display: block;
					top: 15px;
					border-radius: 50%;
					display: none;
					transition: all 0.8s;
				}

				.del {
					background: url(../../assets/images/icon_del.png) no-repeat center center;
					background-size: auto 12px;
					right: 10px;

					&:hover {
						background: url(../../assets/images/icon_del01.png) no-repeat center center #e5f2ff;
						background-size: auto 12px;
					}
				}

				.top {
					background: url(../../assets/images/icon_top.png) no-repeat center center;
					background-size: auto 12px;
					right: 50px;

					&:hover {
						background: url(../../assets/images/icon_top01.png) no-repeat center center #e5f2ff;
						background-size: auto 12px;
					}
				}

				.edit {
					background: url(../../assets/images/icon_edit.png) no-repeat center center;
					background-size: auto 12px;
					right: 30px;

					&:hover {
						background: url(../../assets/images/icon_edit01.png) no-repeat center center #e5f2ff;
						background-size: auto 12px;
					}
				}

				&.active {
					background: #fff;
					box-shadow: 0 0 7px rgba(166, 182, 229, 0.19);
					color: #2379f7;

					&::before {
						box-shadow: 0 0 7px rgba(35, 121, 247, 0.42);
					}
				}

				&:hover {
					background: #fff;
					box-shadow: 0 0 7px rgba(166, 182, 229, 0.19);

					&::before {
						box-shadow: 0 0 7px rgba(35, 121, 247, 0.42);
					}

					.del,
					.top,
					.edit {
						display: block;
					}

					.title {
						padding-right: 75px;
					}
				}
			}
		}
	}

	.newQues {
		width: 100%;
		padding: 10px 0 0;

		&.none {
			padding: 0;
		}

		.name {
			font-size: 13px;
			color: #5f7298;
			line-height: 40px;
			background: url(../../assets/images/icon_tjwt.png) no-repeat left center;
			background-size: 13px 12px;
			padding-left: 20px;

			&.company {
				background: url(../../assets/images/icon_qywt.png) no-repeat left center;
				background-size: 13px 12px;
			}
		}

		.newBox {
			width: calc(100% + 10px);
			margin-left: -5px;
			overflow: hidden;
		}

		.newList {
			width: calc(100% + 10px);
			margin-left: -5px;

			// display: flex;
			// height:34px;
			.newItem {
				background: #fcfdfe;
				border: solid 1px #dceaf8;
				color: #5f7298;
				font-size: 12px;
				line-height: 22px;
				padding: 5px 8px;
				display: inline-block;
				border-radius: 5px;
				margin: 0 5px 10px 5px;
				min-height: 34px;
				// flex: 1;
				// overflow: hidden;
				// white-space: nowrap;
				// text-overflow: ellipsis;
				cursor: pointer;

				&:hover {
					color: #2379f7;
				}
			}
		}

		.searchBox {
			width: calc(100% + 10px);
			margin-left: -5px;
			overflow: hidden;
		}

		.searchList {
			width: calc(100% + 10px);
			margin-left: -5px;

			.searchItemBox {
				margin-bottom: 10px;
				width: 100%;
			}

			.searchItem {
				display: inline-block;
				background: #fcfdfe;
				border: solid 1px #dceaf8;
				min-height: 34px;
				line-height: 32px;
				font-size: 12px;
				color: #5f7298;
				border-radius: 5px;
				padding: 0 10px 0 5px;
				cursor: pointer;
				margin: 0 5px 5px 5px;

				.comp {
					background: url(../../assets/images/icon_qy.png) no-repeat 4px center #e9f0fa;
					background-size: 19px 18px;
					color: #2379f7;
					height: 28px;
					margin: 2px 10px 2px -3px;
					box-shadow: inset 0 0 9px rgba(255, 255, 255, 0.83);
					padding: 0 5px 0 25px;
					line-height: 28px;
					display: inline-block;
					border-radius: 5px;
				}
			}
		}
	}

	.sessionBox {
		flex: 1;
		max-height: 100vh;
		background: #e9f0fa;
		overflow-y: scroll;
		position: relative;

		// scroll-behavior: smooth;
		// transition:all .1s;
		&.none {
			overflow: hidden;
		}

		.temBtn {
			position: fixed;
			background: url(../../assets/images/tem03.png) no-repeat;
			background-size: 100%;
			width: 84px;
			height: 23px;
			top: 480px;
			right: calc((100% - 1060px) / 2);
			z-index: 1001;
			margin-right: 60px;

			.tie {
				position: absolute;
				top: 0;
				left: -10px;
				background: url(../../assets/images/guide_btn.png) no-repeat;
				background-size: 100%;
				width: 21px;
				height: 21px;
			}
		}

		.talktem {
			background: url(../../assets/images/tem02.png) no-repeat center 30px #e9f0fa;
			background-size: auto auto;
			position: fixed;
			left: 280px;
			width: calc(100% - 300px);
			z-index: 10;
			height: 100vh;
		}

		.quesCon {
			width: 780px;
			margin: 0 auto;
			padding: 30px 0 190px 0;

			.loadgin {
				text-align: center;
				color: #666;
			}
		}

		.askCon {
			width: 780px;
			min-height: 150px;
			position: fixed;
			bottom: 0;
			background: #e9f0fa;
			left: calc((100% - 280px) / 2 + 280px);
			z-index: 10;
			padding: 0 0 15px 0;
			margin-left: -390px;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			transition: all 0.8s;

			.bg {
				position: absolute;
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
				z-index: 99;
			}

			&::before {
				content: "";
				top: -10px;
				width: 100%;
				height: 10px;
				position: absolute;
				left: 0;
				background-image: linear-gradient(to top,
						#e9f0fa,
						rgba(233, 240, 250, 0.3));
			}

			&.guide {
				&::before {
					display: none;
				}
			}

			.tie {
				position: absolute;
				top: 50%;
				margin-top: -10px;
				left: -10px;
				background: url(../../assets/images/guide_btn.png) no-repeat;
				background-size: 100%;
				width: 21px;
				height: 21px;
			}

			&.guide {
				background: none;
				z-index: 999;
			}

			&.active {
				// width:100%;
				left: 50%;
				padding: 15px 20px;
			}

			.textBox {
				width: 780px;
				min-height: 75px;
				position: relative;
				// display: flex;
				border-radius: 8px;
				padding: 8px 10px 30px 10px;
				box-sizing: border-box;
				box-shadow: 0 3px 7px rgba(166, 182, 229, 0.4);
				background: #fff;
				position: relative;

				&::before {
					position: absolute;
					left: 0;
					top: 0;
					width: 100%;
					height: 100%;
					content: "";
					border: solid 1px #5d9cf9;
					opacity: 0;
					border-radius: 10px;
				}

				&.active::before,
				&:hover::before {
					opacity: 1;
				}

				.hnrule {
					background: url(../../assets/images/icon_rule.png) no-repeat left center;
					background-size: auto 23px;
					width: 84px;
					height: 25px;
					display: inline-block;
					float: left;
					margin: -4px 8px 0 0;
					position: relative;
					z-index: 999;
				}

				.banpolish {
					// position: absolute;
					background: url(../../assets/images/icon_polish.png) no-repeat center center;
					background-size: 100%;
					width: 26px;
					height: 26px;
					display: inline-block;
					float: left;
					margin: -2px 0 0 5px;
					position: fixed;
					z-index: 99999999;
					cursor: pointer;

					&.load {
						background: url(../../assets/images/loading.gif) no-repeat center center;
						background-size: 20px 20px;
					}

					.bants {
						background-image: linear-gradient(90deg, #8ba4f7, #5488ee);
						width: 120px;
						height: 32px;
						border-radius: 5px;
						margin: 10px 0;
						cursor: pointer;
						position: absolute;
						left: 50%;
						transform: translateX(-50%);
						top: -50px;
						color: #fff;
						line-height: 32px;
						text-align: center;
						display: none;

						i {
							background-image: linear-gradient(90deg, #8ba4f7, #5488ee);
							display: block;
							position: relative;
							z-index: 10;
							width: 100%;
							height: 100%;
							border-radius: 5px;
							font-style: normal;
						}

						&::before {
							content: "";
							width: 10px;
							height: 10px;
							background-image: linear-gradient(90deg, #66e6b1, #2379ff);
							transform: rotate(45deg) translateX(-50%);
							position: absolute;
							bottom: -8px;
							left: 50%;
							z-index: -1;
						}
					}

					&:hover {
						.bants {
							display: block;
						}
					}
				}
			}

			.uploadFile {
				background: url(../../assets/images/entry.png) no-repeat center center;
				background-size: 17px 17px;
				width: 24px;
				height: 24px;
			}

			.commtentx {
				position: relative;

				.commtentxtitle {
					display: flex;
					font-size: 16px;
					color: #010101;
					align-items: center;

					img {
						margin-right: 5px;
					}
				}
			}

			.textCon {
				// flex: 1;
				background: none;
				min-height: 30px;
				max-height: 300px;
				overflow-y: auto;
				line-height: 24px;
				font-size: 16px;
				color: #666;
				overflow-y: hidden;
				outline: none;
				padding: 0 15px 0 0;
				position: relative;
				z-index: 20;
				resize: none;
				font-family: "siyuanR";
				box-sizing: border-box;
				width: 100%;
				display: inline-block;
				float: left;
				color: #c4d0ea;
				word-break: break-word;

				&.active {
					min-width: 30px;
				}

				&.check {
					color: #666;
				}

				&::-webkit-input-placeholder {
					color: #c4d0ea;
				}

				&:focus {
					outline: none;
					border: none;
				}
			}

			.btnPlug {
				background: #fcfdfe;
				width: auto;
				height: 36px;
				position: absolute;
				left: 0;
				top: -40px;
				color: #64b4fe;
				font-size: 13px;
				line-height: 25px;
				padding: 0 10px;
				cursor: pointer;
				z-index: 20;
				transition: all 0.5s;
				border-radius: 5px;

				.add,
				.close {
					width: 12px;
					height: 12px;
					display: inline-block;
					margin-left: 5px;
					transition: all 0.2s;
				}

				.add {
					background: url(../../assets/images/add.png) no-repeat;
					background-size: 100%;
				}

				.close {
					background: url(../../assets/images/close.png) no-repeat;
					background-size: 100%;
				}

				.icon {
					height: 12px;
					width: auto;
					margin-left: 5px;
				}

				&:hover,
				&.active {
					background: #4b90f6;
					color: #fff;

					.add {
						background: url(../../assets/images/add02.png) no-repeat;
						background-size: 100%;
					}
				}
			}

			.btnEnter {
				background: url(../../assets/images/btnenter.png) no-repeat;
				background-size: 100% 100%;
				width: 36px;
				height: 32px;
				position: absolute;
				right: 18px;
				bottom: 10px;
				transition: all 0.5s;
				cursor: pointer;
				z-index: 20;

				&.run {
					background: url(../../assets/images/load.gif) no-repeat;
					background-size: 100% 100%;
					width: 55px;
					height: 37px;
				}

				&:hover {
					transform: scale(1.1);
				}
			}

			.mark {
				font-size: 12px;
				color: #9094b0;
				width: 100%;
				display: block;
				line-height: 20px;
				padding: 10px 20px;
				text-align: center;
				font-family: "siyuanR";
			}
		}
	}

	.chatAnswer {
		box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
		background: #fdfdfe;
		border-radius: 10px;
		width: auto;
		max-width: 100%;
		padding: 20px 30px;
		position: relative;
		z-index: 10;
		min-width: 80px;
		font-size: 14px;
		line-height: 24px;
		width: max-content;
		transition: all 0.5s;

		.chatView {
			color: #333;
		}

		&.markdown-body {
			position: relative;
			z-index: 6;
			font-size: 15px;
			width: 680px;
			font-family: "siyuanR";
			color: #3d434e;
			letter-spacing: 0.75px;
		}

		&.active {
			&.markdown-body {
				width: 100%;
			}

			&::after {
				content: "|";
				color: #000;
				-webkit-animation: blink-data-v-4c6861f6 1s steps(5, start) infinite;
				animation: blink-data-v-4c6861f6 1s steps(5, start) infinite;
			}
		}

		&.runing {
			&::after {
				display: none;
			}
		}

		@-webkit-keyframes blink-data-v-4c6861f6 {

			0%,
			to {
				visibility: hidden;
			}

			50% {
				visibility: visible;
			}
		}

		@keyframes blink-data-v-4c6861f6 {

			0%,
			to {
				visibility: hidden;
			}

			50% {
				visibility: visible;
			}
		}

		.linkbox {
			width: 100%;
			background: #f1f5fb;
			padding: 10px 15px;
			line-height: 28px;
			color: #3a6abd;
			font-size: 14px;
			margin-bottom: 10px;
			border-radius: 5px;
			position: relative;

			i {
				color: #9094b0;
				font-size: 12px;
				margin-left: 15px;
				font-style: normal;
			}

			.btnclose {
				position: absolute;
				font-size: 11px;
				right: 5px;
				bottom: 0;
				color: #3d434e;
				opacity: 0.5;
				padding-right: 20px;
				cursor: pointer;

				&::after {
					position: absolute;
					right: 0;
					width: 20px;
					height: 100%;
					background: url(../../assets/images/btnup.png) no-repeat center center;
					background-size: 8px 5px;
					content: "";
					top: 0;
					z-index: 10;
				}

				&.active {
					&::after {
						transform: rotate(180deg);
					}
				}
			}

			a {
				color: #64b4fe;
				text-decoration: underline;
			}
		}
	}

	.mianBox {
		max-width: 100%;
	}

	.quesBox {
		width: 100%;
		display: flex;
		padding: 0 50px 25px 50px;
		position: relative;

		&.user {
			justify-content: end;
		}

		&.wapuser {
			justify-content: start;
		}

		.userPic {
			width: 42px;
			height: 42px;
			overflow: hidden;
			border-radius: 50%;
			position: absolute;
			top: 0;

			.videoLoad {
				// width:42px;
				// height:42px;
				position: absolute;
				left: 50%;
				top: 50%;
				transform: translate(-50%, -50%);
				border-radius: 50%;
				object-fit: cover;
			}

			&.user {
				border: solid 1px #82adfc;
				right: 0;
			}

			&.run {
				background: #fff;
				border: solid 1px #dfe4eb;
			}

			&.system {
				left: 0;

				&.active {
					border: solid 1px #d4dbe4;
					background: #fff;
				}
			}

			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}
		}

		.quertitle {
			font-size: 15px;
			line-height: 30px;
			color: #fff;
			background: #2379f7;
			border-radius: 8px;
			padding: 8px 25px;
			width: auto;
			max-width: 100%;
			box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
			cursor: pointer;
			transition: all 0.5s;
			font-family: "siyuanR";
			letter-spacing: 0.75px;

			&.selected {
				// user-select: text;
				background-color: #f1f5fb;
				color: #3a6abd;
			}

			&.pdf {
				background: url(../../assets/images/icon-pdf.png) no-repeat 10px 10px #2379f7;
				background-size: auto 25px;
				padding: 8px 25px 8px 38px;
			}

			&.doc {
				background: url(../../assets/images/icon-doc.png) no-repeat 10px 10px #2379f7;
				background-size: auto 25px;
				padding: 8px 25px 8px 38px;
			}

			&.xls {
				background: url(../../assets/images/icon-XLS.png) no-repeat 10px 10px #2379f7;
				background-size: auto 25px;
				padding: 8px 25px 8px 38px;
			}

			&.ppt {
				background: url(../../assets/images/icon-PPT.png?v=100) no-repeat 10px 10px #2379f7;
				background-size: auto 25px;
				padding: 8px 25px 8px 38px;
			}

			&.other {
				background: url(../../assets/images/icon-TXT.png) no-repeat 10px 10px #2379f7;
				background-size: auto 20px;
				padding: 8px 25px 8px 38px;
			}
		}

		.eidtBox {
			width: 100%;
			height: 20px;
			margin-top: 15px;
			position: relative;

			&.active {
				min-width: 400px;
			}
		}

		.btnpage {
			position: absolute;
			right: -55px;
			width: 55px;
			z-index: 10;

			.button-prev,
			.button-next {
				width: 15px;
				height: 20px;
				cursor: pointer;
				display: block;
				display: flex;
				align-items: center;
				justify-content: center;
				float: left;

				img {
					width: 12px;
					height: 12px;
					object-fit: cover;
				}
			}

			.count {
				line-height: 20px;
				width: 25px;
				text-align: center;
				letter-spacing: 2px;
				font-size: 10px;
				color: #666;
				float: left;
			}

			.button-next {
				transform: rotate(180deg);
			}

			&.pc {
				top: 5px;
			}

			&.mobile {
				width: 100%;
				border-top: solid 1px #e7f0f9;
				bottom: 75px;
				right: 0;
				height: 25px;
				display: flex;
				align-items: center;
				justify-content: end;
				padding-right: 10px;

				.count {
					width: 30px;
				}
			}
		}

		.answer {
			font-family: "siyuanR";
			color: $titleColor;
			flex: 1;
			font-size: 14px;
			position: relative;
			max-width: 100%;
			width: auto;

			&.active,
			&.multiple {
				padding-bottom: 15px;
			}

			.generate {
				position: absolute;
				bottom: 0;
				color: #2379f7;
				font-size: 12px;
				line-height: 20px;
				left: 0;
				cursor: pointer;
				z-index: 10;
				min-width: 200px;

				&.beging {
					background: url(../../assets/images/loading.gif) no-repeat left center;
					background-size: 20px 20px;
					padding-left: 25px;
				}

				&.disable {
					cursor: default;
					opacity: 0.5;
				}
			}

			.manage {
				background: #fff;
				width: auto;
				height: 22px;
				border-radius: 20px;
				display: flex;
				float: right;

				.voice {
					background: url(../../assets/images/icon_voice.png) no-repeat center center;
					background-size: 15px 15px;
					width: 35px;
					height: 100%;
					padding: 0 10px;
				}

				.becopy {
					width: 35px;
					padding: 0 10px;
					height: 100%;
					background: url(../../assets/images/icon_copy2.png) no-repeat center center;
					background-size: 15px 15px;
				}

				.belike {
					width: auto;
					height: 100%;
					font-size: 12px;
					background: url(../../assets/images/icon_like01.png) no-repeat 8px center;
					background-size: 15px 15px;
					color: #4a90f5;
					overflow: hidden;
					line-height: 20px;
					padding: 0 10px 0 30px;
					border: solid 1px #4a90f5;
					border-radius: 20px;
				}
			}

			.copy {
				position: absolute;
				bottom: 0;
				width: 84px;
				height: 22px;
				cursor: pointer;
				display: block;
				padding: 0 8px 0 25px;
				color: #9094b0;
				font-size: 12px;
				border-radius: 5px;
				line-height: 20px;
				border: solid 1px #fff;
				transition: all 0.5s;

				&:hover {
					border: solid 1px #4a90f5;
				}
			}

			.btndelete {
				position: absolute;
				bottom: 0;
				right: 189px;
				cursor: pointer;

				.bedelete {
					width: 84px;
					height: 22px;
					cursor: pointer;
					display: block;
					padding: 0 8px 0 25px;
					color: #9094b0;
					font-size: 12px;
					border-radius: 5px;
					line-height: 20px;
					border: solid 1px #fff;
					transition: all 0.5s;
					background: url(../../assets/images/icon_delete.png) no-repeat 8px center #fcfdfe;
					background-size: 11px 12px;

					&:hover {
						border: solid 1px #4a90f5;
						color: #4a90f5;
						background: url(../../assets/images/icon_delete01.png) no-repeat 8px center #fcfdfe;
						background-size: 11px 12px;
					}
				}
			}

			.like {
				position: absolute;
				bottom: 0;
				width: 84px;
				height: 22px;
				cursor: pointer;
				display: block;
				padding: 0 0 0 25px;
				font-size: 12px;
				border-radius: 5px;
				line-height: 20px;
				border: solid 1px #fff;
				transition: all 0.5s;
				right: 0;
				border: solid 1px #4a90f5;
				background: url(../../assets/images/icon_like01.png) no-repeat 8px center #fcfdfe;
				background-size: 11px 11px;
				color: #4a90f5;
				overflow: hidden;

				&:hover {
					border: solid 1px #4a90f5;
				}

				i {
					position: relative;
					font-style: normal;
					z-index: 10;
				}

				.videoCon {
					// width: 25px;
					// height: 25px;
					position: absolute;
					left: 0px;
					top: -2px;
				}

				.dianzan {
					width: 25px;
					height: 20px;
					position: absolute;
					left: 0;
					top: 1px;
					overflow: hidden;

					img {
						width: 36px;
						height: 36px;
					}
				}

				&:hover {
					background: url(../../assets/images/icon_like02.png) no-repeat 8px center #4a90f5;
					background-size: 11px 11px;
					color: #fff;
					border: solid 1px #4a90f5;
				}

				&.active {
					background: url(../../assets/images/icon_like02.png) no-repeat 8px center #4a90f5;
					background-size: 11px 11px;
					color: #fff;
					border: solid 1px #4a90f5;
				}

				&.isEnd {
					background: url(../../assets/images/icon_like02.png) no-repeat 8px center #fcfdfe;
					background-size: 11px 11px;
					color: #4a90f5;
				}
			}

			.copy {
				background: url(../../assets/images/icon_copy.png) no-repeat 8px center #fcfdfe;
				background-size: 11px 12px;
				right: 95px;
				border: solid 1px #dceaf8;

				&:hover {
					background: url(../../assets/images/icon_copy01.png) no-repeat 8px center #fcfdfe;
					background-size: 11px 12px;
					color: #4a90f5;
				}

				&.active {
					background: url(../../assets/images/icon_copy02.png) no-repeat 8px center #4a90f5;
					background-size: 11px 12px;
					color: #fff;
					border: solid 1px #4a90f5;
				}
			}

			.errorAnswer {
				background: rgba(186, 208, 245, 0.6);
				padding: 20px 30px;
				width: 360px !important;

				.errorText {
					padding: 10px 10px;
					border: solid 1px #ef4444;
					background: rgba(241, 74, 70, 0.1);
					border-radius: 5px;
					color: #96384e;
					font-size: 14px;
				}
			}

			.answerBox {
				border-radius: 10px;
				width: 100%;
				position: relative;
				z-index: 6;

				.subscript {
					position: absolute;
					right: 0;
					bottom: 0;
					z-index: 999;
					height: 20px;
				}

				.source {
					background: url(../../assets/images/icon_link.png) no-repeat 13px center #e9f0fa;
					background-size: 9px 12px;
					border-radius: 5px;
					border: solid 1px #e9f0fa;
					height: 34px;
					line-height: 32px;
					padding: 0 15px 0 28px;
					color: #2379f7;
					display: inline-block;
					font-size: 12px;
					cursor: pointer;
				}

				.filepath {
					width: 100%;
					margin-top: 15px;

					.fileItem {
						display: flex;
						align-content: center;
						color: rgba(0, 0, 0, 0.8);
						font-size: 13px;
						line-height: 21px;
						margin: 5px 0;
						font-family: "siyuanN";

						&:hover {
							color: #2379f7;
						}

						img {
							width: auto;
							height: 15px;
							float: left;
							margin: 3px 5px 3px 0;
						}
					}
				}
			}

			&.active {

				.answerBox::after,
				.answerBox::before {
					position: absolute;
					width: calc(100% - 16px);
					left: 8px;
					bottom: -5px;
					background: #f7fafe;
					border-radius: 5px;
					content: "";
					height: 100%;
					box-shadow: 0 3px 7px rgba(166, 182, 229, 0.2);
					opacity: 0.5;
				}
			}

			&.multiple {
				.answerBox::before {
					position: absolute;
					border-radius: 5px;
					content: "";
					height: 100%;
					box-shadow: 0 3px 7px rgba(166, 182, 229, 0.2);
					bottom: -12px;
					width: calc(100% - 30px);
					left: 15px;
					background: #e9eef4;
				}
			}
		}
	}

	@media screen and (max-width: 1080px) {
		.sessionBox {
			.quesCon {
				width: calc(100% - 30px);
				margin: 0 15px;
			}

			.askCon {
				width: calc(100% - 290px);
				margin-left: 0;
				left: 285px;

				.textBox {
					width: 100%;
				}

				&.active {
					left: 0;
					width: 100%;
				}
			}
		}
	}

	@media screen and (max-width: 768px) {
		.sessionBox {
			margin-top: 45px;

			.quesCon {
				width: calc(100% - 20px);
				margin: 0 10px;
			}

			.askCon {
				left: 0;
				width: calc(100% - 5px);
				padding: 5px 5px 25px 10px;
				min-height: 80px;
				margin-left: 0;
				bottom: 0;

				.textBox {
					width: 100%;
				}

				.tie {
					top: 5px;
					width: 16px;
					height: 16px;
					left: -5px;
				}

				.textCon {
					font-size: 14px;
					box-sizing: border-box;
				}

				.mark {
					font-size: 10px;
					line-height: 14px;
				}
			}
		}

		.quesBox {
			padding: 0 0 25px 40px;

			.answer {
				.generate {
					min-width: 60px;
				}
			}

			.quertitle {
				padding: 5px 15px;
			}

			.userPic {
				width: 36px;
				height: 36px;
			}

			.eidtBox {
				&.active {
					min-width: 200px;
				}
			}
		}

		.chatAnswer {
			padding: 10px 8px;

			&.long {
				padding: 10px 8px 50px 8px;
			}

			&.markdown-body {
				width: 100%;
				font-size: 14px;
			}

			.linkbox {
				font-size: 12px;
				line-height: 22px;
			}
		}

		.waptalktem {
			background: url(../../assets/images/tem05.png) no-repeat center top #e9f0fa;
			background-size: 100% 100%;
			position: fixed;
			top: 45px;
			left: 0;
			width: 100%;
			z-index: 10;
			height: 734.5px;
		}

		.newQues {
			.newList {
				.newItem {
					line-height: 18px;
				}
			}
		}
	}

	.btnlink {
		border-radius: 5px;
		background: #f1f5fb;
		color: #3a6abd;
		padding: 0 20px 0 8px;
		height: 30px;
		line-height: 30px;
		cursor: pointer;
		margin-bottom: 5px;
		display: inline-block;
		position: relative;
		box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
		max-width: 100%;
		overflow: hidden;
		font-size: 14px;

		&::after {
			position: absolute;
			right: 0;
			width: 20px;
			height: 100%;
			background: url(../../assets/images/btnup02.png) no-repeat center center;
			background-size: 8px 5px;
			content: "";
			top: 0;
			z-index: 10;
		}

		p {
			margin-bottom: 0;
			color: #333;

			a {
				color: #2379f7;
				text-decoration: underline !important;
			}
		}

		&.active {
			&::after {
				transform: rotate(180deg);
			}
		}
	}

	.videoBox {
		position: relative;
		width: 100%;
		height: 30px;
		box-sizing: border-box;
		margin-bottom: 10px;

		.voiceCeate {
			width: 40px;
			height: 100%;
			background: url(../../assets/images/icon_voice.png) no-repeat center center;
			background-size: 18px auto;
			float: right;
			cursor: pointer;
		}

		.videoBtn {
			height: 100%;

			.audioBtn {
				position: relative;
				width: 120px;
				float: right;
				height: 100%;
				display: flex;
				align-items: center;
				justify-content: start;
				cursor: pointer;

				&::before,
				&::after {
					position: absolute;
					content: "";
					top: 50%;
					transform: translateY(-50%);
				}

				.btnplay {
					background: url(../../assets/images/play02.png) no-repeat center center;
					background-size: 100%;
					width: 20px;
					height: 20px;
					margin-right: 10px;

					&.pause {
						background: url(../../assets/images/pause02.png) no-repeat;
						background-size: 100%;
					}

					&.disable {
						background: url(../../assets/images/loading.gif) no-repeat;
						background-size: 100%;
					}
				}

				.wave {
					background: url(../../assets/images/line02.png) no-repeat left center;
					background-size: 86px 15px;
					flex: 1;
					height: 100%;
				}
			}

			.iswave {
				font-size: 12px;
				color: #999;
				float: right;
				background: url(../../assets/images/loading.gif) no-repeat left center;
				background-size: 20px 20px;
				padding-left: 25px;
			}
		}
	}

	//张晓东那个
	.comitemC {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		align-content: center;
		cursor: pointer;

		.xz {
			width: 16px;
			height: 16px;
			// background: red;
			margin-right: 4px;
			display: flex;
			justify-content: center;
			align-items: center;
			cursor: pointer;

			.xzh {
				width: 12px;
				height: 12px;
				background: url("../../assets/miscel/se2.png") no-repeat center center;
				background-size: 12px 12px;
			}

			&.act {
				.xzh {
					background: url("../../assets/miscel/se1.png") no-repeat center center !important;
					background-size: 12px 12px !important;
				}
			}
		}

		&:hover {
			.xz {
				.xzh {
					background: url("../../assets/miscel/se1.png") no-repeat center center !important;
					background-size: 12px 12px !important;
				}
			}
		}

		.comicName {
			cursor: pointer;
		}

		.comicNameS {
			color: #999;
			font-size: 14px;
			line-height: 32px;

			&.Act,
			&:hover {
				color: #2379f7 !important;
				text-decoration: underline;
			}
		}
	}

	.zhinxj {
		margin-bottom: 10px;

		.wenda {
			width: 100%;
			height: 40px;
			background: #f1f5fb;
			font-size: 14px;
			color: #3a6abd;
			padding: 0 15px;
			border-radius: 10px;
			line-height: 40px;
		}
	}

	.znbj {
		width: 100%;
		background: #f1f5fb;
		padding: 10px;
		margin-bottom: 10px;
		position: relative;
	}

	.dialog1 {
		position: absolute;
		width: 300px;
		background: #fff;
		border-radius: 10px;
		box-shadow: 0 0 10px 1px rgba(166, 182, 229, 0.2);
		padding: 10px 20px;
		left: 0;
		top: 0;
		// transform: translate(-50%,-50%);
		z-index: 999;

		.title1 {
			color: #1b56b6;
			line-height: 28px;
			text-align: left;
			white-space: nowrap;
			font-size: 14px;
			margin-bottom: 16px;
			display: block;

			.show1 {
				display: block;
			}
		}

		.btnpage1 {
			width: 100%;
			display: flex;
			justify-content: flex-end;
			padding: 10px 0;
			font-size: 14px;

			.cancel1 {
				border: solid 1px #afb2c5;
				color: #afb2c5;
				height: 30px;
				border-radius: 5px;
				width: 90px;
				margin-right: 10px;
				cursor: pointer;
			}

			.flexC1 {
				display: flex;
				align-items: center;
				justify-content: center;
			}

			.define1 {
				color: #fff;
				height: 30px;
				border-radius: 5px;
				background: #2379ff;
				width: 90px;
				cursor: pointer;
			}
		}
	}

	.znxjTex {
		width: 100%;
		margin-bottom: 10px;

		.znxjTexInput {
			width: 100%;
			font-size: 14px;
		}
	}

	.znxjWidht {
		flex: 1;
		width: 0;
	}

	.znxjCon {
		background: #f4f4f5;
		padding: 10px 15px;
		box-sizing: border-box;
		width: 100%;
		border-radius: 6px;
		margin-bottom: 10px;

		.znxjCo {
			font-size: 12px;
			line-height: 26px;
			color: #999;
		}
	}

	.dialog {
		position: absolute;
		width: 220px;
		background: #fff;
		border-radius: 10px;
		box-shadow: 0 0 7px rgba(166, 182, 229, 0.6);
		padding: 10px 20px;
		right: 0;
		top: -110px;
		z-index: 999;
		font-size: 14px;

		.title {
			color: #1b56b6;
			line-height: 30px;
			text-align: left;
			white-space: nowrap;
		}

		.btnList {
			width: 100%;
			display: flex;
			justify-content: space-between;
			padding: 10px 0;

			.cancel {
				border: solid 1px #afb2c5;
				color: #afb2c5;
				height: 28px;
				border-radius: 5px;
				width: 80px;
				cursor: pointer;
			}

			.define {
				color: #fff;
				height: 28px;
				border-radius: 5px;
				background: #2379ff;
				width: 80px;
				cursor: pointer;
			}
		}
	}

	@media screen and (max-width: 768px) {
		.dialog {
			width: 230px;
		}

		.diadelete {
			right: -70px;
		}
	}

	.commdesc {
		color: #5f7298;
		font-size: 14px;
		border-bottom: 1px solid #dbe2ee;
		padding-bottom: 5px;
		margin-bottom: 5px;
		width: 726px;

		img {
			display: block;
			float: left;
			width: 20px;
		}

		span {
			// font-weight: bold;
			font-size: 16px;
			color: #3a6abd;
			padding: 0 5px;
		}
	}

	.sessionBox .askCon .comCon {
		max-height: 100px;
		overflow-y: auto;
	}

	.v-enter-active,
	.v-leave-active {
		transition: opacity 0.5s ease;
	}

	.v-enter-from,
	.v-leave-to {
		opacity: 0;
	}

	.aimain {
		width: 100%;
		height: 100%;
		display: flex;
		position: fixed;
		top: 0;
		left: 0;
		background: rgba($color: #000000, $alpha: 0.5);
		z-index: 999;
		align-content: center;
		justify-content: center;
		align-items: center;
	}
</style>